SitePoint Sponsor

User Tag List

Results 1 to 4 of 4
  1. #1
    SitePoint Member
    Join Date
    Feb 2009
    Posts
    24
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    a gap between each div

    somehow my website have strange problem
    like:
    1. there is a gap between header and nav, around 16px
    2. content and footer, around 50px
    3. also it have extra space on my right container, around 40px
    4. my total width on container is 1000px, not 960px

    just a note, I give my container
    /* reset padding and margin for all element */
    *{
    padding: 0px;
    margin: 0px;
    }
    html, body {
    height: 100%;
    background: url(../img/background.jpg) no-repeat center top #fff;
    font-family: 'Lucida Grande',sans-serif;
    color: #fff;
    }
    #container{

    width: 960px;
    min-height: 100%;
    height: auto !important;
    height: 100%;
    margin: 0 auto -80px; /* for firefox */
    }
    #header{

    }
    .pinggiran{
    text-align: center;
    width: 960px;
    height: 90px;
    background: url(../img/back-nav.png) no-repeat;
    }
    .pinggiran ul{
    left: 60px;
    position: relative;
    }
    .pinggiran li{

    list-style: none;
    float: left;
    padding: 0px 20px;
    font-size: 200%;
    background-color: #000;
    position: relative;
    top: 20px;
    }
    .pinggiran li a{
    text-decoration: none;
    font-family: Verdana,Helvetica,sans-serif;
    letter-spacing: -4px;


    }
    .pinggiran li a:hover{
    text-decoration: overline;
    }
    .pinggiran .selected{
    text-decoration: overline;
    padding-bottom: 20px;
    }
    #content{

    text-align: left;
    background-color: #000000;
    width: 92%;
    padding: 20px 4%;
    }
    .content-ul li{
    list-style: square;
    }

    .bawahan {
    background: url(../img/back-footer.jpg) repeat-x;

    }
    .bawahan, .push {
    height: 80px;
    background-color: #000;
    }


    html
    <div id="container">
    <div id="header">
    </div>
    <div class="pinggiran">
    </div>
    <div id="content">
    </div>
    <div class="push"></div>
    </div>
    <div class="bawahan"></div>

    help plz

    and if you notice some stupid naming on class, it was because this site first created by my friend and after that I edit allmost all of it

    plz bear with it

  2. #2
    SitePoint Member
    Join Date
    Feb 2009
    Posts
    24
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)


    this picture will help, if you dont get what I saying

    plz help

  3. #3
    SitePoint Member
    Join Date
    May 2009
    Location
    NY
    Posts
    17
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    i think if you do this
    padding: 0px, 0px, 0px, 0px;
    margin: 0px, 0px, 0px, 0px;
    that sets all 4 margin's to 0px and padding to 0px

  4. #4
    SitePoint Member
    Join Date
    Feb 2009
    Posts
    24
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    yep already doing so, still no change

    because

    paddding: 0px;
    is the same as
    padding: 0px 0px 0px 0px;

    damn I just notice that the horizontal scroll bar is there if I use 1024 resulotion T_T


Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •