Skip to main content

Forums

This topic contains 4 replies, has 3 voices, and was last updated by  vulkanus 21 hours, 38 minutes ago.

Viewing 5 posts - 1 through 5 (of 5 total)
  • Author
    Posts
  • #295835

    kiwis
    Participant

    Really simple, here is my HTML and CSS.. my page has a approx 10px white space at the top, why?

    [code]html{
    margin:0px;
    padding: 0px;
    color: white;
    }

    .black-bar{
    top: 0px;
    width: 100%;
    background-color: black;
    height: 33px;
    }

    .black-bar-container{
    margin: 0px auto;
    width: 1000px;
    line-height: 33px;
    }

    .black-bar-container ul{
    text-align: right;
    }
    .black-bar-container li{
    color: #CCC;
    text-transform: uppercase;
    display: inline-block;
    margin: 0px 10px;
    font-size: .7rem;
    }

    .container{
    background-image: url(“../images/blank2.jpg”);
    width:100%;
    height:100vh;
    background-repeat: no-repeat;
    background-size: cover;
    background-position-y: center;
    }

    .header{
    height: 118px;
    border-bottom: solid 1px rgba(255, 255, 255, 0.75)
    }
    [/code]

    [code]

    2019

    • Balance
    • Date
    • Sim Status

    [/code]

    #295836

    Paulie_D
    Moderator

    We’d need a demo in Codepen.io or JSFiddle.net to see this properly. There’s not much we can tell from isolated HTML & CSS.

    But my first question is, “did you remove all margin and padding from the body?”

    #295839

    kiwis
    Participant
    #295840

    Paulie_D
    Moderator

    Oh, I see… you didn’t reset the margins on the ul to 0.

    I’d sugegst a good “css reset”.

    #296277

    vulkanus
    Participant

    Hi

    Add margin: 0; on this:

    .black-bar-container ul{
    text-align: right;
    margin: 0;
    }

    https://jsfiddle.net/0p7vm35z/

Viewing 5 posts - 1 through 5 (of 5 total)

You must be logged in to reply to this topic.

icon-link icon-logo-star icon-search icon-star