2 divs next to each other

Discussion in 'HTML & Website Design' started by ophir.oren, Dec 9, 2006.

  1. #1
    Hi,
    I'm trying to improve this site.
    I was told that today it's better to relay more on CSS then on regular old html tags (like tables).

    If you look at the menus on the website - now they are build out of a table - one <td> that contains the image, and one that contains the text.
    I want to make it in CSS so I put the image in one styled <div> tag and the text in another. the problem is that div breaks line so they don't end up one next to the other. how can I tell the div not to break line so that 2 divs can stay one next to the other?
     
    ophir.oren, Dec 9, 2006 IP
  2. dp-user-1

    dp-user-1 Well-Known Member

    Messages:
    794
    Likes Received:
    20
    Best Answers:
    0
    Trophy Points:
    110
    #2
    <div style="float: left;">Content</div> should work.
     
    dp-user-1, Dec 9, 2006 IP
  3. ophir.oren

    ophir.oren Peon

    Messages:
    141
    Likes Received:
    2
    Best Answers:
    0
    Trophy Points:
    0
    #3
    Thnks. That does the trick :)
     
    ophir.oren, Dec 9, 2006 IP
  4. ophir.oren

    ophir.oren Peon

    Messages:
    141
    Likes Received:
    2
    Best Answers:
    0
    Trophy Points:
    0
    #4
    ok, an update. while fload: left; did seem to enable 2 divs next to each other, if you look at the site I'm trying to improve, when I do that the entire top menu stays at the left of the page - no matter how I played with it (now I've set it back to the old file because I can't leave it that way).
    what should I do?
     
    ophir.oren, Dec 9, 2006 IP
  5. livingearth

    livingearth Well-Known Member

    Messages:
    1,469
    Likes Received:
    83
    Best Answers:
    0
    Trophy Points:
    140
    #5
    You could always use absolute positioning...
    <div style="position:absolute;top:10px;left:10px;width:200px;height:25px;">
    Content here
    </div>
    <div style="position:absolute;top:10px;left:210px;width:200px;height:25px;">
    Picture Here
    </div>
     
    livingearth, Dec 9, 2006 IP
  6. dp-user-1

    dp-user-1 Well-Known Member

    Messages:
    794
    Likes Received:
    20
    Best Answers:
    0
    Trophy Points:
    110
    #6
    Well, it might take more divs. What basic layout (an image would help) are you trying to achieve?
     
    dp-user-1, Dec 9, 2006 IP