CSS Question

Out of context: Reply #6

  • Started
  • Last post
  • 29 Responses
  • epikore0

    How do I make the id "left" stay left within the div tag "main" rather than all the way to the left of the browser?

    <!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>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <title>CSS Page</title>

    <style type="text/css">
    body {
    background-color: #F9F1BF;
    margin-left: 0px;
    margin-top: 0px;
    margin-right: 0px;
    margin-bottom: 0px;
    font-family: Verdana, Geneva, sans-serif;
    color: #600;
    font-size: 11px;
    }

    #main {
    background-color:#930;
    width: 800px;
    height: 1200px;
    }

    #header {
    background-color:#C63;
    width: 780px;
    height: 50px;
    padding: 10px;
    }

    #menu {
    background-color:#FC0;
    width: 780px;
    height: 20px;
    padding: 10px;
    }

    #left {
    background-color:#396;
    width: 200px;
    height: 400px;
    padding: 10px;
    position:absolute;
    top: 300px; left: 0;
    }

    #middle {
    background-color:#963;
    width: 350px;
    height: 900px;
    padding: 10px;

    }

    #right_top {
    background-color:#FCC;
    width: 200px;
    height: 300px;
    padding: 10px;
    }

    #right_bottom {
    background-color:#03C;
    width: 200px;
    height: 400px;
    padding: 10px;
    }

    </style>
    </head>

    <body>
    <center>
    <div id="main">

    <div id="header">
    </div>

    <div id="menu">
    </div>

    <div id="left">
    hello<br/>
    hello<br/>
    hello<br/>

    </div>

    <div id="middle">
    hello<br/>
    hello<br/>
    hello<br/>
    </div>

    <div id="right_top">
    hello<br/>
    hello<br/>
    hello<br/>
    </div>

    <div id="right_bottom">
    hello<br/>
    hello<br/>
    hello<br/>
    </div>

    </div>

    </div>
    </center>
    </body>
    </html>

    epikore 0Permalink
    UpvoteDownvote
    Flag
      Show [[ numHiddenNotes ]] more notesAdd Note
      SaveCancel

    View thread