最好的方式来定位divs正确的css

我需要做一个网站顶部与一些navegations工具。最好的方式来定位divs正确的css

它工作，但我不舒适。我想也许这不是正确的方法来做这些浮动股权。

我需要一个图像在左边和两个itens在全宽div的右边。

所以我做：

<div id="menu"> 
    <div id="logo">LOGO</div> 
    <div id="item">Settings</div> 
    <div id="item">Options</div> 
</div>

和

#menu{ 
    position:fixed; 
    width:100%; 
    height:50px; 
    background:#fff; 
} 

#logo{ 
    float:left; 
    right:30px; 
} 

#item{ 
    float:right; 
    right:30px; 
    margin-right:10px; 
}

它是确定与浮动权和其他一切还是我应该改变些什么呢？ jsfiddle

来源

2016-03-26 Rick Joe

你不能有相同的'id'两个元素。改用'class'。除此之外，这对我来说很好。 –

你可以使用它，但只是改变这两个ID是类，如果你想你可以做到这一点与flexbox，但它已经可以 – DanyCode

哦，谢谢你的朋友！ –

Flexbox ...不需要浮动或定位....所有项目都按正确的顺序。

#menu { 
 
    position: fixed; 
 
    width: 100%; 
 
    height: 50px; 
 
    background: #fff; 
 
    display: flex; 
 
} 
 
.logo { 
 
    margin-right: auto; 
 
} 
 
.item { 
 
    margin-right: 10px; 
 
}

<div id=menu> 
 
    <div class="logo">LOGO</div> 
 
    <div class="item">Settings</div> 
 
    <div class="item">Options</div> 
 
</div>

来源

2016-03-26 19:11:40

非常感谢！ –

on #item right：30px如果您不指定位置，则不执行任何操作。使用

#item{ 
    float:right; 
    position:relative; 
    right:30px; 
}

来源

2016-03-26 19:02:25 luk492

最好的方式来定位divs正确的css

回答

相关问题