1. Advertising
    y u no do it?

    Advertising (learn more)

    Advertise virtually anything here, with CPM banner ads, CPM email ads and CPC contextual links. You can target relevant areas of the site and show ads based on geographical location of the user if you wish.

    Starts at just $1 per CPM or $0.10 per CPC.

Modifying an existing web page with <div>

Discussion in 'CSS' started by chrisj, Feb 12, 2011.

  1. #1
    I'm working with an existing web page, and I'm trying to modify it.
    I'm trying to put all the html in a container with a black border.
    I added a new <div> right below the <body> tag and a closing div right before a new closing </div>. Like so:

    <body>
    <div class="container1">
    .......lots of existing html code......
    </div>
    </body>
    Code (markup):
    And the css for this new container loks like this:

    .container1{
    border:2px solid #000000;
    background:#;
    padding:0px;
    width:960px;
    height:1000px;
    float:;
    margin:0px
    }
    Code (markup):
    However, the 2px border shows up in the background of the upper part of the web page, but pushes the lower part of the page downward. I was hoping all the page code could be inside this new 2px border, but instead only part of the page is. Can you give me a suggestion as to how to remedy this?
     
    chrisj, Feb 12, 2011 IP
  2. buzenko

    buzenko Peon

    Messages:
    93
    Likes Received:
    3
    Best Answers:
    0
    Trophy Points:
    0
    #2
    I do not quite understand what you mean on your piece of code.
    Show your all code.
    Maybe use
    height:100%;
    width:auto;
    Code (markup):
    or
    * {
     padding:0;
     margin:0;
    }
    Code (markup):
     
    buzenko, Feb 12, 2011 IP
  3. tusharambalia

    tusharambalia Peon

    Messages:
    21
    Likes Received:
    0
    Best Answers:
    0
    Trophy Points:
    0
    #3
    Please provide more details over this.
     
    tusharambalia, Feb 13, 2011 IP
  4. kiramanic

    kiramanic Peon

    Messages:
    205
    Likes Received:
    7
    Best Answers:
    0
    Trophy Points:
    0
    #4
    Are you sure you need to give it a fixed height? If there's not enough content to fill 1000px it'll look weird, and if there's too much it'll be chopped off.

    If you can link us to the site one of us can probably spot your problem :)
     
    kiramanic, Feb 13, 2011 IP
  5. jeremyhowell

    jeremyhowell Member

    Messages:
    379
    Likes Received:
    7
    Best Answers:
    2
    Trophy Points:
    45
    #5
    Yeah, a link to the site would be helpful. But I Tried this code, and it is working fine for me, possibly there is already another container div which doesn't want to stay inside of your new container, try just modifying the css for that instead of adding another container, assuming it exists at all.

    
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head>
    <style>
    .container1 {
    border:2px solid #000000;
    background:#;
    padding:0px;
    width:960px;
    height:1000px;
    margin:0px auto;
    }
    </style>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <title>Untitled Document</title>
    </head>
    
    <body>
    <div class="container1">
    <p>Hellow</p>
    <p>hello again</p>
    </div>
    </body>
    </html>
    
    
    Code (markup):
     
    jeremyhowell, Feb 13, 2011 IP
  6. srisen2

    srisen2 Peon

    Messages:
    359
    Likes Received:
    2
    Best Answers:
    0
    Trophy Points:
    0
    #6
    try removing the float:;
     
    srisen2, Feb 14, 2011 IP