Blog coding and discussion of coding about JavaScript, PHP, CGI, general web building etc.

Thursday, February 25, 2016

HTML & CSS white gap above navbar

HTML & CSS white gap above navbar


I'm still new to HTML & CSS. I've experienced a issue which I can't figure out how to fix.

There is a white gap above the navbar. Is it possible I can do it so it's attached to the top.

HTML

  

CSS

.navbar {      margin-top: 0px;  }  .navbar ul {      position: absolute;      top: 0px;      left: 0px;      right: 0px;      list-style-type: none;      background-color: #333;  }    .navbar li {      float: right;      font-weight: 700;  }    .navbar li a {      display: block;      color: white;      text-align: center;      padding: 14px 16px;      text-decoration: none;  }    .navbar li a:hover {      background-color: #e74c3c;  }  

Answer by Anoxy for HTML & CSS white gap above navbar


There is always a default margin and padding from the browser so you have to do this in your css

body{  margin:0;  padding:0;}  

Answer by herrh for HTML & CSS white gap above navbar


Try this css, because of the browsers default margin of the ul.

.navbar ul {    margin: 0 auto;  }  

Answer by marijn for HTML & CSS white gap above navbar


A browser has some default margin and padding so you can undo this in your CSS by putting in:

body{  margin:0;  padding: 0;  }  

Answer by Microsmsm for HTML & CSS white gap above navbar


Use the following code to remove the margin of the ul

The default margin is 16px

ul {    margin:0;  }  

WORKING DEMO

Answer by Chihab JR for HTML & CSS white gap above navbar


try this:

html, body  {       padding: 0;       margin: 0;  }  

Answer by Sabbir Ahmed Siddiquee for HTML & CSS white gap above navbar


Just use margin: 0; inside like this.

.navbar ul{margin: 0;}   

Check demo here

Answer by Ricardo for HTML & CSS white gap above navbar


You could do something like this

   *{  padding:0;  margin:0;  }  

the problem of it is you'll need to set a margin and padding at every div that you make.

OR

  ul{  margin:0;  padding:0;  }  

Answer by Iqbal Pasha for HTML & CSS white gap above navbar


yes there is border top at .navbar class add this line in .navbar {border-top : 0px;}


Fatal error: Call to a member function getElementsByTagName() on a non-object in D:\XAMPP INSTALLASTION\xampp\htdocs\endunpratama9i\www-stackoverflow-info-proses.php on line 72

0 comments:

Post a Comment

Popular Posts

Powered by Blogger.