Home/ Questions/Q 7930195
In Process

The Archive Base Latest Questions

Editorial Team
  • 0
Asked: 2026-06-03T20:20:45+00:00

i would like to have a container (with some text) on the left of

  • 0

i would like to have a container (with some text) on the left of the page, that adapts itself with the space available, and 2 sidebars following on the right (i’m using WordPress).
(The 2 sidebars work fine with float. ) So i tried width:auto on the container.

But it does not adapt itself with the rest of the space available (it takes all the page width). If i set the width to 70%, it fits the space on the index page, but if i click on an article, i only have 1 sidebar left, so there is a blank space between the text and the sidebar.

Do you know how to fix this? 

#container { /* the text */
    overflow:auto;
    width:auto;
    position:relative;
    float:left;
}

#primary { /* first sidebar */
    position:relative;
    border:1px solid red;
    float:right;
    width:250px;
}


#second { /* second sidebar */
    border:1px solid red;
    background:white;
    width:250px;
    height:auto;
    float:right;
    margin-left:15px;
}

Thanks

EDIT :

let’s say i’m using this instead of the wordpress sidebars : i still can’t manage to make it work, could someone have a look with this simple code? there’re 2 boxes : the green one and the red one…

<!DOCTYPE>
<html>
    <head>
        <meta charset="UTF-8" />
    </head>
        <body>

            <div style="position:relative; width:700px; margin:0 auto;">
                <div style="width:auto; border:1px solid green;">i would like to have a container (with some text) on the left of the page, that adapts itself with the space available, and 2 sidebars following on the right (i'm using WordPress). (The 2 sidebars work fine with float. ) So i tried width:auto on the container.

But it does not adapt itself with the rest of the space available (it takes all the page width). If i set the width to 70%, it fits the space on the index page, but if i click on an article, i only have 1 sidebar left, so there is a blank space between the text and the sidebar.</div>

<div style="width:20%; float:right; border:1px solid red;">blablabla</div>
            </div>

        </body>
</html>
Share

Leave an answer

You must login to add an answer.

Need An Account,

1 Answer

  1. Editorial Team

    Ok, i found it out : put the text at the end, use overflow:hidden and auto, and float right on the small container on the right, thanks for your answers.

    • 0