如何确定CSS边框的大小？

Question

我正在使用在线教程自己学习html，css和javascript。 BBC徽标旁边的CSS边框太短。 请告诉我为什么。

浏览器：

代码： http : //pastebin.com/FWrs084N （此代码将始终存在）

Answer 1

您的填充略有下降。 检查这个小提琴

基本上将logodiv的属性从

padding-top: 7px;

至

padding: 6px 80px 12px 20px

为了避免将来发生这种情况，理想情况下，您将添加一个具有相同属性的类名，以使元素获得一致的样式。

Answer 2

 body{ margin:0; font-family: Helmet,Freesans,Helvetica,Arial,sans-serif; } #topbar{ background-color: #CC0101; width: 100%; height: 40px; color: white; margin-top: 10px; } .fixedwidth{ width: 1050px; margin: 0 auto; } #logodiv{ padding-right: 10px; border-right: 5px solid #DA4C4C; } #signindiv{ font-weight: bold; padding: 0 80px 0 20px; font-size: 0.9em; border-right: 5px solid #DA4C4C; } #topmenudiv ul{ margin: 0; padding:0; } #topmenudiv li{ list-style: none; font-weight: bold; font-size: 0.9em; border-right: 5px solid #DA4C4C; height: 100%; padding: 0 20px 8px 20px; } .fixedwidth > div { display: table-cell; vertical-align: middle; } 

 <div id="container"> <div id="topbar"> <div class="fixedwidth"> <div id="logodiv"> <img src="images/logo.png"/> </div> <div id="signindiv"> <img src="images/signin.png"/> Sign in </div> <div id="topmenudiv"> <ul> <li>News</li> <li></li> <li></li> </ul> </div> </div> </div> </div> 

祝好运！