ansaurus

Question

HTML/CSS: Creating a centered div with a min-width

Answer 1

+2 A:

Its not a perfect solutions, but I've gotten around some issues of IE6 lack of support for min-width by saying.

<style type="text/css">            
            .container-minwidth {
                min-width: 5em;

                width: auto !important;
                width: 500px; /* IE6 ignores the !important tag */

                /* would help for expanding content if it blows past 500px; */
                overflow:auto; 

                display: inline-block;
                border: 1px solid blue;
            }        
</style>

The other tag that might help in this situation is the overflow tag.

bendewey 2009-02-02 04:49:06

Answer 2

+1 A:

Actually Alessandro IE6 does understand display: inline-block, what it doesn't understand about your code is the min-width. There are many hacks to get this to work, but I wouldn't recommend any of them. If you are going to use any of them make sure to put them in an IE6 specific style sheet so that it doesn't interfere with your other more standard complaint browsers.

Nick Berardi 2009-02-02 04:49:51

Answer 3

A:

This is the most helpful CSS hack I've found on the web in a long time. I needed to center a CSS-styled button (sliding doors bg images technique) in my form and this worked perfectly. Thanks so much!

Meredith 2010-06-09 20:58:45

@Meredith, I'm glad this helped, but next time you might want to write this as a "comment" (not an "answer"), this way other people going through this page won't think this is an alternative answer.

Alessandro Vernet 2010-06-10 19:48:51

ansaurus

tags:

views:

answers:

HTML/CSS: Creating a centered div with a min-width

related questions