As was foretold, we've added advertisements to the forums! If you have questions, or if you encounter any bugs, please visit this thread: https://forums.penny-arcade.com/discussion/240191/forum-advertisement-faq-and-reports-thread/
Options

CSS help

Spectral SwallowSpectral Swallow Registered User regular
edited March 2012 in Help / Advice Forum
So I've gone through the w3 schools website and I've played with dreamweaver and notepad and I have no clue how to get this to work.

pageexample.png

Basically I want it so that however wide the image is, the box expands to that width and the variable width makes up the rest. I can make it work with tables (by making the first cell 1px and the table automatically formats to make it the same width as the image), but for some reason the css is kicking my butt.
Any help is greatly appreciated.

Spectral Swallow on

Posts

  • Options
    InfidelInfidel Heretic Registered User regular
    Try something like this? Inline CSS to illustrate.
    <div id="container" style="width: 90%;">
      <div id="leftbody" style="width: 80%;">
        <div id="imagecol" style="float: left;"><img /></div>
        <div id="content" style="float: left;"></div>
      </div>
      <div id="rightbody" style="width: 20%;"></div>
    </div>
    

    OrokosPA.png
  • Options
    Spectral SwallowSpectral Swallow Registered User regular
    That still give me the problem I've been having where it stacks the 'cells' instead of placing them to the left and right of each other.

    example2pr.png

    I swear I've tried just about everything at this point.
    :(

  • Options
    SeñorAmorSeñorAmor !!! Registered User regular
    What about this?

    Scroll down to "How To Create A Variable-Width Three Column Layout".

  • Options
    InfidelInfidel Heretic Registered User regular
    That still give me the problem I've been having where it stacks the 'cells' instead of placing them to the left and right of each other.

    example2pr.png

    I swear I've tried just about everything at this point.
    :(

    Woops, sorry, leftbody and rightbody should both have float: left; as well (a standard two-column type thing).

    OrokosPA.png
Sign In or Register to comment.