Jump to content

osxvictoria

Members
 View Profile  See their activity

  • Posts

    2

  • Joined

  • Last visited

 Content Type 

Posts posted by osxvictoria

    Margin Questions

    in CSS

    Posted

    there is not a lot of code:

     

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html>
    <head>
    <link type='text/css' rel='stylesheet' href='reset.css' />
    <link type='text/css' rel='stylesheet' href='styles.css' />
    </head>
    <body>
    <div id='wrapper'>
    <div id='header'>
    <h1>VMCS</h1>
    </div>
    <div id='nav'>
    <a href='http://www.apple.com'>Members</a>
    <a href="http:www.google.com">About Us</a>
    </div>
    <div id='content'>
    <h2>this is an h2 typing</h2>
    <p> this is the words on screen</p>
    </div>
    </div>
    </body>
    </html>
    body{
    background-color: #121212;
    background-image: url(images/body.png);
    background-repeat: repeat-y;
    }
    #wrapper{
    background-image: url(images/tapestry1.jpg);
    background-repeat: repeat-y;
    width: 900px;
    height: auto;
    margin: 2%;
    margin-left: auto;
    margin-right: auto;
    }
    h1{
    color: rgba(1,1,1,.1);
    font-size: 4em;
    }
    #header{
    background-image: url(images/headerbg.png);
    border-radius: 0px 128px 0px 0px;
    height: 310px;
    margin-bottom: 10px;
    border: 5px solid red;
    }
    a:link{
    font-size: 2em;
    padding: 25px; margin: 40px;
    border: 3px solid green;
    }
    #content{
    font-size: 1em;
    margin: 30px;
    height: 400px
    }

    Margin Questions

    in CSS

    Posted

    Hey all,

    I'm just starting back up in HTML and CSS after a while away. I'm having an issue or two though and can't seem to find any clear answers. I have a header and a:link objects like so:

     

    <div id='header'>
    <h1>VMCS</h1>
    </div>
    <div id='nav'>
    <a href='http://www.apple.com'>Members</a>
    <a href="http:www.google.com">About Us</a>
    </div>
    And in my css I have a set height for the header; 310px; however the a:link items below seem to be over lapping. They have 40px padding and I tried basic margins before that. I can't figure out WHY the overlapping is occurring. Any advice or help would be great thanks!
    my css just in case:
    #header{
    background-image: url(images/headerbg.png);
    border-radius: 0px 128px 0px 0px;
    height: 310px;
    }
    a:link{
    font-size: 2em;
    padding: 40px;
    background-color: #573;
    }

     

×
×
  • Create New...