为什么我的CSS宽度在aspx页面中不起作用？

我显示我的代码第一为什么我的CSS宽度在aspx页面中不起作用？

<div class = "buttonsHolder"> 
    <asp:Button runat = "server" ID = "btnAdd" Text = "Add New" CssClass = "buttonUserControl" /> 
    <div class = "horizontalSpace"></div> 
    <asp:Button runat = "server" ID = "btnEdit" Text = "Edit" CssClass = "buttonUserControl" /> 
    <div class = "horizontalSpace"></div> 
    <asp:Button runat = "server" ID = "btnDelete" Text = "Delete" CssClass = "buttonUserControl" /> 
</div>

我的CSS是

.buttonsHolder 
{ 
height:25px; 
width:465px; 
border: solid 1px; 
} 

.horizontalSpace 
{ 
width:20px; 
float:left; 
} 

.buttonUserControl 
{ 
width:105px; 
height:24px; 
}

但horizontalSpace不工作，不管有多少宽度我已经给

还有一点要补充，我不擅长HTML CSS。  可以是一个选项，以保持按钮之间的空间，但我的CSS有什么问题，以及如何解决它，而不需要` ？

来源

2011-10-29 Pankouri

你可以发布HTML代码片段吗？没有看到HTML就很难回答你的问题。是否有您正在测试的特定浏览器？ – calvinf

你的按钮非常宽（425px）很多。 – Icarus

我很确定无论宽度如何，空div都会崩溃。你大概可以在每个div里放一个，但看到我的答案是另一种更清晰的方法。 – nycdan

如果你只是想在你的按钮之间的水平空间，放置一个保证金，而不是在他们之间放置div。

在.buttons类把

margin-right: 20px;

来源

2011-10-29 05:08:44 nycdan

我已经改变了我的帖子，请看看，并请寄给我宝贵的回馈。我在等待 – Pankouri

它迟到了，再次看，你可能需要把它放在buttonController中。我不确定按照你设置的方式在按钮类中是如何工作的，但是它应该很容易尝试。 – nycdan

你有它设置的方式，无论是你的“水平间隔”被浮起一路向左。所以你最有可能在左边增加40px的额外空间，然后你的内联按钮根本就没有间隔。

但是，我会建议不使用水平间距元件。相反，在每个按钮的左侧或左侧添加边距，并根据是否要支持CSS2，删除第一个或最后一个元素的边距。

CSS：

.buttons .buttonUserControl 
{ 
margin-right: 20px; 
}

HTML：

<div class = "buttons"> 
<asp:Button runat = "server" ID = "btnAdd" Text = "Add New" CssClass = "buttonUserControl" /> 
<asp:Button runat = "server" ID = "btnEdit" Text = "Edit" CssClass = "buttonUserControl" /> 
<asp:Button runat = "server" ID = "btnDelete" Text = "Delete" CssClass = "buttonUserControl" /> 
</div>

如果你不关心有额外的右边界的最后一个元素，这将正常工作。如果你想删除它，有两个选择：1）为了支持CSS2，你需要在最后一个元素上添加一个手动样式来设置margin: 0或者2）要使用CSS3，你可以添加.buttons .buttonUserControl:last-of-type { margin: 0 }。

来源

2011-10-29 05:12:19 animuson

我纠正了我的帖子，所以请再看看 – Pankouri

@Pankouri：你似乎添加的唯一东西是'buttonUserControl'类，它不会影响我的答案。 – animuson

thnx哥们，它morgin正确20px为我工作 – Pankouri

为什么我的CSS宽度在aspx页面中不起作用？

回答

相关问题