求教一个css的有关问题
求教一个css的问题
上面是代码
下边是css
我就是想问下<div id="title"> 在 <div id="logindisplay"> 的上面,为什么页面出现的效果是 <div id="logindisplay"> 在上面
#logindisplay
{
font-size:1.1em;
display:block;
text-align:right;
margin:10px;
color:White;
}
如果 margin:10px; 是相对定位的话,那么id为logindisplay的应该在title的下边间隔为10才对啊, ,,,
------解决方案--------------------
#logindisplay
{
font-size:1.1em;
display:block;
text-align:right;
margin:10px;
color:White;
clear:both;
}
楼主 试试
------解决方案--------------------
title 使用了float 脱离了文本流
logindisplay就跑上去了。
------解决方案--------------------
float:left的原因,给#logindisplay样式加一个clear:both;清楚浮动的样式
------解决方案--------------------
楼上的都是正解.
------解决方案--------------------
------解决方案--------------------
title 使用了float 脱离了文本流 ,不在尊顺原来的文本流布局了,只是以父级为基础定位, 而其他的子级依然按照原来的文本流布局...这样
logindisplay 就占据了原来的title所在的位置,...logindisplay就跑上去了
------解决方案--------------------
建议了解一下浮动,文档流。。
------解决方案--------------------
一:你的title层加了样式float:left;导致第二个层紧排在他的右边。
二:那是因为<h1>是自带margin值的,导致左边层离顶部空间加大,只是离顶部距离大于右边离顶部的距离而已
so easy
- HTML code
<div class="page"> <div id="header"> <div id="title"> <h1>Welcome to my blog</h1> </div> <div id="logindisplay"> <% Html.RenderPartial("LogOnUserControl"); %> </div> <div id="menucontainer"> <% Html.RenderPartial("UserMenuControl"); %> </div> </div> <div class="main"> <asp:ContentPlaceHolder ID="MainContent" runat="server" /> <div id="footer"> </div> </div> </div>
上面是代码
下边是css
- CSS code
.page { width: 90%; margin-left: auto; margin-right: auto; } #header { position: relative; margin-bottom: 0px; color: #000; padding: 0; } div#title { display:block; float:left; text-align:left; } #logindisplay { font-size:1.1em; display:block; text-align:right; margin:10px; color:White; } #menucontainer { margin-top:40px; }
我就是想问下<div id="title"> 在 <div id="logindisplay"> 的上面,为什么页面出现的效果是 <div id="logindisplay"> 在上面
#logindisplay
{
font-size:1.1em;
display:block;
text-align:right;
margin:10px;
color:White;
}
如果 margin:10px; 是相对定位的话,那么id为logindisplay的应该在title的下边间隔为10才对啊, ,,,
------解决方案--------------------
#logindisplay
{
font-size:1.1em;
display:block;
text-align:right;
margin:10px;
color:White;
clear:both;
}
楼主 试试
------解决方案--------------------
title 使用了float 脱离了文本流
logindisplay就跑上去了。
------解决方案--------------------
float:left的原因,给#logindisplay样式加一个clear:both;清楚浮动的样式
------解决方案--------------------
楼上的都是正解.
------解决方案--------------------
------解决方案--------------------
title 使用了float 脱离了文本流 ,不在尊顺原来的文本流布局了,只是以父级为基础定位, 而其他的子级依然按照原来的文本流布局...这样
logindisplay 就占据了原来的title所在的位置,...logindisplay就跑上去了
------解决方案--------------------
建议了解一下浮动,文档流。。
------解决方案--------------------
一:你的title层加了样式float:left;导致第二个层紧排在他的右边。
二:那是因为<h1>是自带margin值的,导致左边层离顶部空间加大,只是离顶部距离大于右边离顶部的距离而已
so easy