简单的CSS样式 - 定位div的

这是一个关于CSS的非常简单的问题。我想在图片中描绘的风格，我想这样的代码：

#parent { 
    overflow: hidden; 
text-align:center; 
} 
.navbar { 
position:absolute; 
top:0px; 
right:3px; 
} 
.logo { 
float:left; 
} 
.table { 
float:left; 
}

，但它不为我工作，我得到这个： not this!

来源

2012-07-18 Lorenzo Comoglio

尝试：

#parent { 
overflow: hidden; 
text-align:center; 
margin:auto; 
width:80%; 
} 
.navbar { 
position:absolute; 
top:0px; 
right:3px; 
} 
.logo { 
float:left; 
} 
.table { 
float:left; 
}

为了达到你想要的效果，你需要使用margin:auto来居中父母分隔符，并使用width:80%来放置一个流体宽度。

来源

2012-07-18 19:59:45

你好，这是工作的表和标志，但导航栏不符合表。 – 2012-07-18 20:02:55

您将需要显示一些HTML。 – 2012-07-18 20:05:28

我用body {margin：0 0 0 0; }，谢谢你的帮助！ – 2012-07-18 20:12:49

我给你的父元素一个明确的宽度，然后是位置从那里：

#parent { 
    width: 960px; 
    margin: 0 auto; 
    position: relative; 
} 

.navbar { 
    position: absolute; 
    top: 0; 
    right: 3px; 
} 

.logo { 
    margin-bottom: 20px; 
    display: inline-block; 
} 

.table { 
    width: 100%; 
}

我不知道你在网页上有什么其他的内容，但你的.logo元素应该出现你想要使用默认的HTML流程。如果表格是100％，则会清除。你应该能够在没有浮动的情况下将其关闭。

来源

2012-07-18 20:03:55 chipcullen

简单的CSS样式 - 定位div的

回答

相关问题