Floating two side by side div boxes to the center of a containing div

Posted on 2009-04-29
Last Modified: 2012-05-06
How could i float two side by side div boxes to the center of a containing div.

I need the  div boxes to remain in the center of the page regardless of the size of the browser window. But if there is room for them both to be displayed side by side that is how they should be displayed. ( still remaining in the center )

Any ideas?
<div aling="center" id="visiableContentWraper" style="width:100%;">

	<div id="automotive" style="float:left; width:520px;">

		content for automotive		


	<div id"realEstate" style="float:left; width:520px;">

		content for realEstate



Open in new window

Question by:Cybervanes
    LVL 42

    Expert Comment

    by:David S.
    I suggest you use display:inline-block (with browser workarounds) instead of float:left. This explains how:
    LVL 2

    Author Comment

    Yeah I already tryed that and I cant get it to work. Divs overlapping and only the far left side of the first div is aligned on the center line.

    Thanks tho!
    LVL 42

    Expert Comment

    by:David S.
    Please show us your the code you used when you tried that technique.  It is tricky, but I've used it many times myself.
    LVL 42

    Accepted Solution

    Ah. This is the other question I posted the wrong example link to. Sorry about that.

    Check out the technique shown here:
    LVL 2

    Author Closing Comment


    Write Comment

    Please enter a first name

    Please enter a last name

    We will never share this with anyone.

    Featured Post

    Better Security Awareness With Threat Intelligence

    See how one of the leading financial services organizations uses Recorded Future as part of a holistic threat intelligence program to promote security awareness and proactively and efficiently identify threats.

    Suggested Solutions

    Title # Comments Views Activity
    CSS for Safari only 5 35
    Replacing hover background color on a menu 5 20
    HTML table 7 38
    Can wordpress do social media pages 2 20
    Introduction A frequently asked question goes something like this:  "I am running a long process in the background and I want to alert my client when the process finishes.  How can I send a message to the browser?"  Unfortunately, the short answer …
    Introduction If you're like most people, you have occasionally made a typographical error when you're entering information into an online form.  And to your consternation, the browser remembers the error, and offers to autocomplete your future entr…
    In this Micro Tutorial viewers will learn how to create a CSS image sprite (In a later tutorial, viewers will learn how to use CSS and HTML to create a navigation menu using this sprite) Open a new Photoshop document with a width of (Icon width)x(N…
    The viewer will learn the basics of jQuery, including how to invoke it on a web page. Reference your jQuery libraries: (CODE) Include your new external js/jQuery file: (CODE) Write your first lines of code to setup your site for jQuery.: (CODE)

    760 members asked questions and received personalized solutions in the past 7 days.

    Join the community of 500,000 technology professionals and ask your questions.

    Join & Ask a Question

    Need Help in Real-Time?

    Connect with top rated Experts

    9 Experts available now in Live!

    Get 1:1 Help Now