SitePoint Sponsor

User Tag List

Results 1 to 2 of 2
  1. #1
    SitePoint Member
    Join Date
    Jul 2008
    0 Post(s)
    0 Thread(s)

    div not resizing

    Hi I am making a layout with a header on top, a left and right column in the middle and a footer at the bottom. However, I am up to the middle part where the left and right column is and when I resize the window the right column doesn't resize correctly along with the other divs. and at some point I get a horizontal scroll bar, however I need to be exactly the same at an 800x600 minimum. Here is the code:

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "">

    <html xmlns="" xml:lang="en" >
    <head id="Head1" >
    <title>Untitled Page</title>
    <style type="text/css">

    html, body, form{height: 100%; width: 100%; padding: 0; margin: 0;

    background-color: green;}

    #header{width: 100%; height: 50px; background-color: red;}
    ul{list-style: none; display: inline; padding: 0; margin: 0; float: right;}

    #left{float: left; width: 200px; height: 85%; background-color: yellow; padding-right: 84.2%;}

    #float-wrap{width: 100%; height: 100%;}

    #right{width: 84.2%; background-color: Gray; height: 85%; padding: 0; margin: 0;
    float: left; margin-left: -84.2%;}

    #right p{padding: 0; margin: 0;}
    <form id="form1">

    <div id="header">

    <div id="float-wrap">
    <div id="left">

    asdasdads adadsds


    <div id="right">

    <p>dadsads asdasddas asdasdasd</p>





    Does anybody know what the problem may be?

  2. #2
    SitePoint Guru
    Join Date
    Nov 2005
    0 Post(s)
    0 Thread(s)


Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts