Page 1 of 1

How do I text-align center, when floating left?

Posted: Wed Aug 07, 2013 9:43 am
by simonmlewis
I am trying to line up DIVs, but to get them centered inside another DIV. So rather than lining up from the left, they are horizonally centered. I'm sure it's easy to do, but having trouble seeing how.....

Code: Select all

<style>

.subcat_topboxes
{ width: 250px;
float: left;
}
</style>

echo "<div style='text-align: center'>";
$result = mysql_query ("SELECT name, photo, information FROM subcategories WHERE catid = '$catid'");
while ($row = mysql_fetch_object($result))
      {
      echo "<div class='subcat_topboxes'><img src='/images/pages/$row->photo' /><br/>$row->name<br/>$row->information</div>";
      }
      	mysql_free_result($result);
      	echo "<div style='clear: both' /></div></div>";


Re: How do I text-align center, when floating left?

Posted: Wed Aug 07, 2013 10:38 am
by Christopher
I would recommend putting all the subcat_topboxes divs in a wrapper div, and then centering that inside your outer div.

Re: How do I text-align center, when floating left?

Posted: Wed Aug 07, 2013 10:41 am
by simonmlewis

Code: Select all

echo "<div style='text-align: center'>";
This is the wrapper div. Centered.

Re: How do I text-align center, when floating left?

Posted: Wed Aug 07, 2013 10:56 am
by Christopher
That centers what is inside of it. It does not center the wrapper div. That's why I recommended wrapping the subcat_topboxes with another div inside your current wrapper.

Re: How do I text-align center, when floating left?

Posted: Wed Aug 07, 2013 10:59 am
by simonmlewis
Sorry I don't understand.
The Wrapper has an internal text-align center, so would have thought anythign in there would be centered. Plus it's not got a width set so goes full width.

Can you show me what you mean please.