Dismiss Notice
Join Physics Forums Today!
The friendliest, high quality science and math community on the planet! Everyone who loves science is here!

I'm trying to center box in CSS and HTML

  1. Oct 29, 2007 #1
    Please help!!

    Does anyone here know much about CSS and HTML? I'm trying to center box (have it as a span with a div inside - a box in a box) both horizontally and vertically. I can get it to work just fine in Firefox, but IE won't let me do it. I've tried everything I can think of, I've looked for help online and tried what I found. Nothing. Does anyone know how to do it?
  2. jcsd
  3. Oct 29, 2007 #2


    User Avatar
    Science Advisor

    If you're using vertical-align or valign then that's the problem since it doesn't work well for divs in IE.

    You should either go with a table cell, or use absolute positioning. For example:
    Code (Text):

    <body leftmargin="0px" topmargin="0px">
        Using absolute positioning
        <div style="width:300px;height:300px;border:solid 1px #000000;">
            <div style="left:100px;top:100px;width:100px;height:100px;border:solid 1px #000000;position:absolute;z-index:2">
        Using table cells
        <table cellspacing="0px">
                <td align="center" valign="middle" width="300px" height="300px" style="border:solid 1px #000000">
                    <div style="width:100px;height:100px;border:solid 1px #000000;"></div>
Share this great discussion with others via Reddit, Google+, Twitter, or Facebook