保证金 - 正确的CSS不工作

我在学校里一直在搞编码，因为它在学校里最感兴趣的事情，并且在学年的大部分时间里都自学了Html-Css和Js。保证金 - 正确的CSS不工作

我一直在重新创建我的学校的网站，我遇到了一些问题。

我的CSS“Margin-Right”命令没有工作。我一直在试图用CSS和“样式”命令将一个<Div>区域居中放置，使用左右边距，右边将无法工作。
我不想只使用position: absolute;命令，因为我希望在侧面留出一些空间，以便您可以看到背景。
这是我的Html代码。

CSS：

.Isaac { 
     width: 100%; 
     padding: 4px; 
     margin-right:100px; 
     background-color: white; 
     -webkit-box-shadow: 0px 0px 24px rgba(0, 0, 0, 0.4); 
     -moz-box-shadow: 0px 2px 12px rgba(23, 69, 88, .5); 
     -webkit-border-radius: 100px; 
     -moz-border-radius: 100px; 
     border-radius: 10px; 
    }

HTML：

<div class="Isaac" Style="Background-color: #E6E6E6 ; Margin-Top: 40px"> 
     <!-- div content --> 
    </div>

编辑： “100X” 的东西只是我的一个愚蠢的错误，我的意思是有 “100像素”
另外，我更改保证金 - 右：100倍;以margin-right：100px;它仍然没有区别
我希望你能帮助我

来源

2016-04-21 Isaac Sybrandy

如果复制相关的代码和它贴在这里会更容易，这样我们不有通过所有你在你的链接有代码脱脂。向我们提供可以给你提供问题和HTML的CSS部分。 – andre3wap

感谢Stack Err。 –

什么是'100x'？此外，尝试没有大写的首字母缩写。 – ForceMagic

的问题是在.Isaac的div的width:100%什么。这使得divs自己和父母身体一样宽。然后，余量延伸到屏幕右侧。

解决方案：删除width:100%。

 
 
    .Isaac { 
 
     /*width: 100%;*/ 
 
     padding: 4px; 
 
     Margin-Right: 100px; 
 
     background-color: white; 
 
     -webkit-box-shadow: 0px 0px 24px rgba(0, 0, 0, 0.4); 
 
     -moz-box-shadow: 0px 2px 12px rgba(23, 69, 88, .5); 
 
     -webkit-border-radius: 100px; 
 
     -moz-border-radius: 100px; 
 
     border-radius: 10px; 
 
    } 
 

 
    .myButton { 
 
     -moz-box-shadow: inset 0px 5px 0px 0px #000000; 
 
     -webkit-box-shadow: inset 0px 5px 0px 0px #000000; 
 
     box-shadow: inset 0px 1px 0px 0px #000000; 
 
     background: -webkit-gradient(linear, left top, left bottom, color-stop(0.05, #ffffff), color-stop(1, #ffffff)); 
 
     background: -moz-linear-gradient(top, #ffffff 5%, #ffffff 100%); 
 
     background: -webkit-linear-gradient(top, #ffffff 5%, #ffffff 100%); 
 
     background: -o-linear-gradient(top, #ffffff 5%, #ffffff 100%); 
 
     background: -ms-linear-gradient(top, #ffffff 5%, #ffffff 100%); 
 
     background: linear-gradient(to bottom, #ffffff 5%, #ffffff 100%); 
 
     filter: progid: DXImageTransform.Microsoft.gradient(startColorstr='#ffffff', endColorstr='#ffffff', GradientType=0); 
 
     background-color: #ffffff; 
 
     -moz-border-radius: 3px; 
 
     -webkit-border-radius: 3px; 
 
     border-radius: 3px; 
 
     border: 1px solid #000000; 
 
     display: inline-block; 
 
     cursor: pointer; 
 
     color: #000000; 
 
     font-family: Arial; 
 
     font-size: 13px; 
 
     padding: 6px 24px; 
 
     text-decoration: none; 
 
     text-shadow: 0px 1px 0px #000000; 
 
    } 
 
    
 
    .myButton:hover { 
 
     background: -webkit-gradient(linear, left top, left bottom, color-stop(0.05, #ffffff), color-stop(1, #ffffff)); 
 
     background: -moz-linear-gradient(top, #ffffff 5%, #ffffff 100%); 
 
     background: -webkit-linear-gradient(top, #ffffff 5%, #ffffff 100%); 
 
     background: -o-linear-gradient(top, #ffffff 5%, #ffffff 100%); 
 
     background: -ms-linear-gradient(top, #ffffff 5%, #ffffff 100%); 
 
     background: linear-gradient(to bottom, #ffffff 5%, #ffffff 100%); 
 
     filter: progid: DXImageTransform.Microsoft.gradient(startColorstr='#ffffff', endColorstr='#ffffff', GradientType=0); 
 
     background-color: #ffffff; 
 
    } 
 
    
 
    .myButton:active { 
 
     position: relative; 
 
     top: 1px; 
 
    } 
 

 
/* I added this, because the body start tag doesn't appear in the snippet */ 
 
body { 
 
    background-attachment: fixed; background-repeat: no-repeat; Background-size: 100% 100%; background-image:url(https://upload.wikimedia.org/wikipedia/commons/3/32/Mount_Rainier_from_above_Myrtle_Falls_in_August.JPG) 
 
    }

<div class="Isaac" Style="Background-color: #E6E6E6; Margin-Top: 40px"><img src="http://www.conway.k12.wa.us/sites/default/files/logov4.png" style="width:150px;height:50px;"><a href="#" class="Hello">Menu</a> : <a href="#" class="Hello">Family access</a> : <a href="#" class="Hello"> Facebook/Social Media<a/> : <a href="#" class="Hello"><br><a href="#" class="MyButton">District Office</a> 
 
    <a 
 
    href="#" class="myButton">School Office</a><a href="#" class="myButton">Departments</a><a href="#" class="myButton">Staff</a><a href="#" class="myButton">Family</a><a href="#" class="myButton">Teachers</a><a href="#" class="myButton">Board</a></div>

来源

2016-04-25 13:18:39

变化：

Margin-Right: 100x;

到：

margin-right: 100px;

来源

2016-04-21 18:05:08

这没有工作 –

请给我一个链接到网站。 –

使用文本对齐中心对齐的内容居中

问题与保证金权利是您使用：x而不是px

。艾萨克宽度：100％; padding：4px; text-align：center; margin-right：100px; background-color：white; -webkit-box-shadow：0px 0px 24px rgba（0，0，0，0.4）; -moz-box-shadow：0px 2px 12px rgba（23，69，88，.5）; -webkit-border-radius：100px; -moz-border-radius：100px; border-radius：10px; }

希望这是你想要达到

来源

2016-04-21 18:08:46 abhinsit

我希望按钮不要居中，而背景则显示在两侧。 –

保证金 - 正确的CSS不工作

回答

相关问题