user3689427
user3689427

Reputation: 41

Why Ul upper white space

When I put unordered list

then why top bar goes down ?? I cannot find the reason behind this.Please tell me how to fix this problem ?

http://jsfiddle.net/fLchtkp1/

body {
  margin: 0;
  padding: 0;
}
.top-bar {
  height: 40px;
  width: 100%;
  background-color: yellow;
}
#menu {
  width: 1020px;
  height: : 100%;
  margin: 0 auto;
  background-color: red;
}
ul {
  background-color: red;
  width: 100%;
  height: 40px;
}
<body>
  <div class="top-bar">
    <div id="menu">
      <ul>
        <li>Menu1</li>
      </ul>
    </div>
  </div>
</body>

Upvotes: 0

Views: 135

Answers (2)

Vitorino fernandes
Vitorino fernandes

Reputation: 15951

use this for removing padding and margin which is given by browsers

*{
    margin:0;
    padding:0;
}

you will get more information on reset css here

here are the list of css styles used to reset

http://www.cssreset.com/

Upvotes: 2

MSTannu
MSTannu

Reputation: 1033

The ul element has margin-top by default from browser. To remove that, add the style

ul {
    margin-top: 0;
}

Upvotes: 2

Related Questions