hi geoffrey,

did you try 

display:inline

put it in example 3 and it seems to work everywhere.

tina 



> Von: Geoffrey Hoffman <[email protected]>
> Datum: Mon, 16 Mar 2009 11:44:47 -0700
> An: CSS-Discuss <[email protected]>
> Betreff: [css-d] inline-block ignored by IE6
> 
> Hi List,
> 
> I'm trying to code a Photoshop layout given to me where the H1 element
> has a border-bottom that is only the length of the text. I first tried
> this:
> 
>    <!-- Example 1 -->
>    h1 {
>       font-size:160%;
>       font-family:"Times New Roman", Times, serif;
>       font-variant:small-caps;
>       border-bottom:1px solid maroon;
>    } 
>    <h1>Lorem Ipsum Dolor Sit Amet</h1>
>    <!-- End Example 1 -->
> 
> 
> The problem with the above is that the maroon line goes all the way to
> the right edge of the container. As it should; H1 is a block level
> element.
> 
> Even though the below example looks perfect, I would like to avoid using
> a span tag if possible, because in addition to extraneous markup, the
> site content will be editable from within a CMS and I can't expect my
> users to know about inserting span tags inside their h1's...
> 
> 
>    <!-- Example 2 -->
>    h1 {
>       font-size:160%;
>       font-family:"Times New Roman", Times, serif;
>       font-variant:small-caps;
>    }
>    h1 span {
>       border-bottom:1px solid maroon;
>    }
>    <h1><span>Lorem Ipsum Dolor Sit Amet</span></h1>
>    <!-- End Example 2 -->
> 
> 
> I just discovered that display:inline-block gives me exactly what I want
> in Gecko:
> 
> 
>    <!-- Example 3 -->
>    h1 {
>       font-size:160%;
>       font-family:"Times New Roman", Times, serif;
>       font-variant:small-caps;
>       border-bottom:1px solid maroon;
>       display:inline-block;
>    }
>    <h1>Lorem Ipsum Dolor Sit Amet</h1>
>    <!-- End Example 3 -->
> 
> 
> But as with most wonderfully simple solutions, of course, IE6
> misbehaves.
> 
> I've already had a look at trying to force hasLayout, using zoom: 1 [1],
> and other IE6/7 inline-block posts[2] but none seem to work in my case.
> 
> Any suggestions?
> 
> Thanks,
> 
> Geoff
> 
> [1] http://www.satzansatz.de/cssd/onhavinglayout.html
> [2] http://www.brunildo.org/test/InlineBlockLayout.html
> 
> ______________________________________________________________________
> css-discuss [[email protected]]
> http://www.css-discuss.org/mailman/listinfo/css-d
> List wiki/FAQ -- http://css-discuss.incutio.com/
> List policies -- http://css-discuss.org/policies.html
> Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
> 


______________________________________________________________________
css-discuss [[email protected]]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
List policies -- http://css-discuss.org/policies.html
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/

Reply via email to