Results 1 to 3 of 3

Thread: CSS frames, width problem

  1. #1
    Join Date
    Mar 2007
    Location
    All over the world, actually in Thailand
    Posts
    2
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Question CSS frames, width problem

    Hi, I've a problem with the width of top and bottom CSS frame. The top frame should has the width until the right frame and the bottom frame should has the width of 100%, the right frame shouldn't go over the bottom frame. Does somebody knows how to realize?

    Thank you for every idea.
    Daniel

    Here the sample gif of the result:
    Here the css code:

    #framecontentLeft{
    position: absolute;
    top: 180px; /*Width of top frame div*/
    left: 0;
    bottom: 100px; /*Width of bottom frame div*/
    width: 241px; /*Width of left frame div*/
    overflow: hidden; /*Disable scrollbars. Set to "scroll" to enable*/
    background-color: black;
    color: white;
    }

    #framecontentRight{
    position: absolute;
    left: auto;
    top: 0;
    right: 0;
    bottom: 100px;
    width: 240px; /*Width of right frame div*/
    color: white;
    overflow: hidden; /*Disable scrollbars. Set to "scroll" to enable*/
    background-color: red;
    color: white;
    }

    #framecontentTop{
    position: absolute;
    top: 0;
    right: 0; /*Set right value to WidthOfRightFrameDiv*/
    left: 0; /*Set left value to WidthOfLeftFrameDiv*/
    height: 180px; /*Height of top frame div*/
    width: auto;
    overflow: hidden; /*Disable scrollbars. Set to "scroll" to enable*/
    background-color: yellow;
    color: black;
    }

    #framecontentBottom{
    position: absolute;
    top: auto;
    right: 0; /*Set right value to WidthOfRightFrameDiv*/
    left: 0; /*Set left value to WidthOfLeftFrameDiv*/
    width: 100%;
    height: 100px; /*Height of bottom frame div*/
    overflow: hidden; /*Disable scrollbars. Set to "scroll" to enable*/
    background-color: brown;
    color: white;
    }

    #maincontent{
    position: fixed;
    top: 180px; /*Set top value to HeightOfTopFrameDiv*/
    bottom: 100px; /*Set bottom value to HeightOfBottomFrameDiv*/
    left: 241px; /*Set left value to WidthOfLeftFrameDiv*/
    right: 240px; /*Set right value to WidthOfRightFrameDiv*/
    overflow: auto;
    background-color: black;
    color: white;
    }

    .innertube{
    margin: 15px; /*Margins for inner DIV inside each DIV (to provide padding)*/
    }
    Last edited by stedan; 03-21-2007 at 11:10 AM.

  2. #2
    Join Date
    Mar 2007
    Location
    All over the world, actually in Thailand
    Posts
    2
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Default

    I've to add the information that I checked in Firefox and it's working fine. It's this f.. IEX who make this troubles, I think I need to do integrate an IEX hack, the hack proposed by dynamicdrive doesn't work in this case.

    Every idea appreciated.

    Thank's

  3. #3
    Join Date
    Mar 2007
    Posts
    28
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Default

    Please pass on the html code with it so i might be able to help.



    P.S sorry i accidently clicked on the link that says thank this user for his post. so don't mind that.

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
  •