SitePoint Sponsor

User Tag List

Results 1 to 5 of 5
  1. #1
    SitePoint Wizard WorldNews's Avatar
    Join Date
    Nov 2007
    Posts
    1,033
    Mentioned
    1 Post(s)
    Tagged
    0 Thread(s)

    How does one place multiple divs next to one another without causing break line?

    Hi,

    I want to have multiple divs next to one another, without them breaking into a new line, but all staying in same line.
    Example:

    <div class="name_lable">User name/div> <div class="name_form">John Doe</div>

    How does one do this?

    And just to make sure: your suggestion should also work on IE.

    ThanX.

    Anoox search engine volunteer

    www.anoox.com

  2. #2
    Community Advisor silver trophybronze trophy
    dresden_phoenix's Avatar
    Join Date
    Jun 2008
    Location
    Madison, WI
    Posts
    2,804
    Mentioned
    34 Post(s)
    Tagged
    2 Thread(s)
    the MOST basic way is to use FLOAT

    you can float:left or float:right.
    floats remove the element from the normal flow and shrink wrap it ( so you might need to specify a width along with your float declaration. You will also want to clear the floats. By far the BEST WAY is to give overflow:hidden; to the parent element.

    Another way... is to make give your elements display:inline-block. you will probably want to add -moz-inline-box in your rules for OLD Firefox.


    Hope that helps

  3. #3
    SitePoint Wizard WorldNews's Avatar
    Join Date
    Nov 2007
    Posts
    1,033
    Mentioned
    1 Post(s)
    Tagged
    0 Thread(s)
    Hi,

    It is not working.
    You can see a sample page here:
    http://www.dreamdates.com/profile.php?mem=1536989

    Check out the section at bottom of page labeled: More details about me
    Those Label Value pairs should be in the same line, but they are not!

    I also tried display:inline-block, and it was even worst

    Anoox search engine volunteer

    www.anoox.com

  4. #4
    The CSS Clinic is open silver trophybronze trophy
    Paul O'B's Avatar
    Join Date
    Jan 2003
    Location
    Hampshire UK
    Posts
    40,367
    Mentioned
    180 Post(s)
    Tagged
    6 Thread(s)
    Check your widths as they are greater than the space available.

    Just add a background colour and you will see that they overlap.

  5. #5
    Non-Member bronze trophy
    Join Date
    Nov 2009
    Location
    Keene, NH
    Posts
    3,760
    Mentioned
    23 Post(s)
    Tagged
    0 Thread(s)
    I can't even find in your page where you're trying to do that -- but to be brutally frank placing a couple of DIV are the least of your issues with the horde of outdated 1990's style HTML! Tables for layout, tags like FONT and CENTER that have zero business on a website written after 1998, use of bold tags on what should probably be headings, use of bold tags on what should be DT's... that's how you end up with 16k of HTML for 2.7k of content -- basically two or three times as much code as should be necessary... hence the 127 validation errors meaning you don't even have HTML, you have gibberish.

    Even simple things like the attempt to use italics inside TITLE -- which can only contain CDATA -- are an indication the whole thing needs to be thrown away and redone from scratch as there's nothing there I'd even TRY to save, much less deploy.


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
  •