Results 1 to 7 of 7

Thread: css positioning standard

  1. #1
    Join Date
    Oct 2008
    Posts
    50
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Default css positioning standard

    for example if i have an index.html:

    <div id="banner"><center><img src="image way"></center></div>

    and a style.css with

    #banner{padding:0;tp:0}

    why doesn't the browser do't listen and it doens't put the image on top=0 and it pun standard posotion 5px above?

  2. #2
    Join Date
    Nov 2006
    Location
    chertsey, a small town 25 miles south west of london, england.
    Posts
    1,920
    Thanks
    2
    Thanked 267 Times in 262 Posts

    Default

    Hi there alexdog1805,

    it has probably slipped your memory but the body element is one of the elements that has a default margin.

    This code example will achieve the effect that you require....
    Code:
    
    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
       "http://www.w3.org/TR/html4/strict.dtd">
    <html lang="en">
    <head>
    
    <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
    <meta name="language" content="english"> 
    <meta http-equiv="Content-Style-Type" content="text/css">
    
    <title></title>
    
    <style type="text/css">
    body {
        padding:0;
        margin:0;
     }
    #banner img {
        display:block;
        width:324px;
        height:200px;
        margin:auto;
        background-color:#999;
     }
    </style>
    
    </head>
    <body>
    
    <div id="banner">
    <img src="image-way.jpg" alt="">
    </div>
    
    </body>
    </html>
    
    coothead

  3. #3
    Join Date
    Oct 2008
    Posts
    50
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Default

    but now i can't set the top to other elements.for exemple

    #text{top:50px;}

    how can I do that the browser set the other top?

  4. #4
    Join Date
    Oct 2008
    Posts
    50
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Default

    does somebody knows?

  5. #5
    Join Date
    Nov 2006
    Location
    chertsey, a small town 25 miles south west of london, england.
    Posts
    1,920
    Thanks
    2
    Thanked 267 Times in 262 Posts

    Default

    Hi there alexdog1805,
    does somebody knows?
    from the minimal information that you have supplied, it is almost impossible to know what you're problem is.

    Do you have a link to the site in question?

    coothead

  6. #6
    Join Date
    Oct 2008
    Posts
    50
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Default

    well the problem is that if I do like coothead told me it is ok...it appears on top:0 but if I want to put another photo or text for example at top:100px it doesn't listen and it appears next above to image banner.

  7. #7
    Join Date
    Nov 2006
    Location
    chertsey, a small town 25 miles south west of london, england.
    Posts
    1,920
    Thanks
    2
    Thanked 267 Times in 262 Posts

    Default

    Hi there alexdog1805,

    does this help...
    Code:
    
    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
       "http://www.w3.org/TR/html4/strict.dtd">
    <html lang="en">
    <head>
    
    <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
    <meta name="language" content="english"> 
    <meta http-equiv="Content-Style-Type" content="text/css">
    
    <title></title>
    
    <style type="text/css">
    body {
        padding:0;
        margin:0;
     }
    #banner img {
        display:block;
        width:324px;
        height:200px;
        margin:auto;
        background-color:#999;
     }
    #content {
        margin-top:50px;
        text-align:center;
        background-color:#999;
    }
    </style>
    
    </head>
    <body>
    
    <div id="banner">
    <img src="image-way.jpg" alt="">
    </div>
    
    <div id="content">
    Lorem ipsum dolor sit amet, consectetuer adipiscing elit.
    </div>
    
    </body>
    </html>
    
    coothead

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
  •