【问题标题】:Need help DIV alignment(position) in css在css中需要帮助DIV对齐(位置)
【发布时间】:2013-05-13 16:50:42
【问题描述】:

我正在开发 joomla 模板,我有两个 div,每个 div 有 2 个 div。 边界 顶部菜单

    <div id='menu' class='span12' >
    <div id='mainmenu' class='span9'> Main Menu</div>
    <div id='search' class='span3'> Search </div>
    </div>

我正在使用 bootstrap.min.css 一切都很好,但是我在每个 div(top, menu) 中的第二个(top-menu, search) div 在完成我的第一个 div 之后显示在顶部边框下; 这是我的 CSS 样式

#top
{
background-color: black;
height:40px;
}
#top-border
{
background-color: red;
height:30px;
float:left;
}
#top-menu
{
background-color: blue;
float:right;
height:30px;
}
#menu
{
background-color: purple;
height:50px;
}
#mainmenu
{
background-color: yellow;
height:40px;
}
#search
{

background-color: brown;
float:right;

height:40px;
}
#photo
{
background-color: green;
margin-right:-20px;
height:300px;
}

当我将宽度 100% 放在 #top 中时,它工作正常,但宽度发生了变化。 知道如何在不使用 width:100% 的情况下解决这个问题;

【问题讨论】:

    标签: css joomla


    【解决方案1】:

    网格有 12 列,您使用的是 9+3..所以整个网格。您应该检查 div 中的边距,并将它们设置为 0。这通常是它现在按您预期的方式工作的原因。

    【讨论】: