In the following pseudo-code, I want the parent DIV to be floated to the left, so that I can put content (i.e. an image) on the right. I have that working fine. I want to add a DIV inside the left-floated DIV that is centered - it can be anything, a group of links, images, a table, etc. How can I do this??

<div style="float: left; text-align:left">
    <p>Lorem ipsum... Lorem ipsum... Lorem ipsum... Lorem ipsum... Lorem ipsum... Lorem ipsum... Lorem ipsum... Lorem ipsum... Lorem ipsum... Lorem ipsum... Lorem ipsum... </p>
    <div id="centerMe">
        <div style="float: left;">
            <a href="index.html">Home</a>
        </div>
        <div style="float: left;"">
            <a href="about.html">About Us</a>
        </div>
        <div style="float: left;">
            <a href="contactus.html">Contact Us</a>
        </div>
    </div>
</div>

1 answer

5
points

If I'm understanding correctly you need to set a width on the floated elements, and a width on the element you want to center (less than its parent) and then use margin: 0 auto; to center it.

You'll probably want to add overflow: hidden; to it too so that it contains the floated elements within.

Answered over 6 years ago by Tony Crockford
  • Thanks, I will try this.... Eric Belair over 6 years ago