Problem with CSS property display: inline-block

Question

In quirks mode (IE) the following code will function correctly. In standards compliant mode, this code will only show the text of the nested span, but it will not be given 100% for width. Is there a way to force the nested inline-block span to set its width to the div size, and if so is there a way to do it without changing the html code? Thanks for any help.

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Frameset//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-frameset.dtd">
<html>
<head>
    <style>
        span {display:inline-block;}
    </style>
<head>
<body>
    <div>
        <span>
            <span style='width:100%; text-align:center;'>
                Blah
            </span>
        </span>
    </div>
</body>

Simone · Accepted Answer · 2011-09-21 17:03:58Z

1

The parent (span) don't have any width. Just set it and you resolve your problem

div span { width:100% }

answered Sep 21, 2011 at 17:03

Simone

21.6k15 gold badges84 silver badges112 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

Problem with CSS property display: inline-block

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related