Html 如何使div底部对齐？
Html 如何使div底部对齐？,html,css,Html,Css,我似乎无法将div id=“navigation”与图像对齐。有人能帮我做CSS吗？谢谢 以下是HTML代码： <body> <div class="container"> <div class="header"><img id="logo" src="images/logo.png" /> <div id="navigation"> <ul> <li>
我似乎无法将
div id=“navigation”<body>
<div class="container">
<div class="header"><img id="logo" src="images/logo.png" />
<div id="navigation">
<ul>
<li><a href="#">Menu link 1</a></li>
<li><a href="#">Menu link 2</a></li>
<li><a href="#">Menu link 3</a></li>
</ul>
</div>
</div>
<div class="sidebar">Sidebar</div>
<div class="content">Main content</div>
<div class="footer">Footer content</div>
</div>
</body>
为导航添加一些边距，将其向下推到您要查找的级别，如下所示：
#navigation {
margin-top:45px; /* adjust as needed */
}
或者您可以将标题的高度和标题位置设置为相对，以将导航设置为
bottom:0px
.container{
宽度：80%；
最大宽度：1260px；
最小宽度：780px；
背景：黄色；
保证金：0自动；
高度：150像素；
}
.标题{
宽度：100%；
浮动：左；
背景：橙色；
位置：相对位置；
}
#标志{
浮动：左；
显示：块；
}
#航行{
左边距：50像素；
填充：0px 50px 0px 0px；
浮动：左；
背景：粉红色；
位置：绝对位置；
底部：0px；
}
#导航ul{
列表样式类型：无；
}
#导航李{
显示：内联；
}
#导航a{
浮动：左；
保证金：0px 80px 0px 0px；
}
.侧边栏{
明确：两者皆有；
浮动：左；
宽度：20%；
背景：红色；
}
.内容{
浮动：左；
宽度：80%；
}
.页脚{
明确：两者皆有；
位置：相对位置；
背景：绿色；
}
谢谢您的回复。有没有一种方法可以在不硬编码最高边距值的情况下获得相同的结果？如果徽标图像更改，我将不得不更改CSS代码…@Boris您可以，但这将意味着使用ickyposition:absolute
，另一种方法是使用vertical align:bottom
属性，但您必须设置标题的高度。感谢您的回复。在不设置.container
上的高度的情况下，是否可以使用类似的方法？我试图避免CSS中的硬编码值（以防徽标图像更改）