Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 2 of 2
  1. #1
    Xax
    Xax is offline
    New to the CF scene
    Join Date
    Oct 2007
    Posts
    8
    Thanks
    0
    Thanked 0 Times in 0 Posts

    How do I float a sidebar inside the main body?

    I'm trying to figure out the best way to float a sidebar inside the main body of my page (not the full height of the main body, just a section in the middle). I'm new to CSS, but I'm thinking I could define a style for a sidebar using margins, but then I'm not sure how this would work inside the main body (would they overlap?). I tried to span a regular ol' table, but the main body text wouldn't display beside it.

    Thanks in advance!

  • #2
    Regular Coder
    Join Date
    Sep 2007
    Location
    Raleigh, NC
    Posts
    273
    Thanks
    7
    Thanked 59 Times in 52 Posts
    You'd just want to make sure that the sidebar was inside of the main div, and float it right:

    Code:
    <div id="main-content">
      <div id="sidebar">
         ... sidebar stuffs ...
      </div>
      ... main stuffs ...
    </div>
    EDIT: If you just want it floating to the right of a specific section of your main text (which as I reread your post might of been what you were asking about) just enclose that section in a div:

    Code:
    <div id="main-content">
      .. main stuff ..
      <div>
          .. more main stuff 
          <div id="sidebar">
             .. sidebar ..
          </div>
      </div>
       .. more main stuff ..
    </div>
    Last edited by vtjustinb; 10-25-2007 at 04:54 PM. Reason: Answer clarification


  •  

    Posting Permissions

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