[thelist] Shrink wrapping a div?

Adam Henson redace at pacific.net
Thu May 13 17:24:10 CDT 2004


On May 13, 2004, at 2:54 PM, Maximillian Schwanekamp wrote:

> Christopher Mahan replied:
> <div class="a">
>   <div class="b">
>     <p>Some text</p>
>   </div>
> </div>
>
> .a{
>   text-align:center;
>   }
> .b{
>   display: inline;
>   border: 1px solid #ff0000
>   }
> -------------------------
>
> Thanks for the reply, but that gives inconsistent results 
> cross-browser.
> The question is how to present a framing box around the content.  
> Setting
> display: inline defeats that.  Oh well, I think I'll just have to set
> margins on the outer div put a border on the inner one with display: 
> block.
> Was hoping for a more "contractive" effect rather than the regular
> "expansive" nature of the div element.


On May 13, 2004, at 2:54 PM, Maximillian Schwanekamp wrote:
> Christopher Mahan replied:
> <div class="a">
>   <div class="b">
>     <p>Some text</p>
>   </div>
> </div>
>
> .a{
>   text-align:center;
>   }
> .b{
>   display: inline;
>   border: 1px solid #ff0000
>   }
> -------------------------
>
> Thanks for the reply, but that gives inconsistent results 
> cross-browser.
> The question is how to present a framing box around the content.  
> Setting
> display: inline defeats that.  Oh well, I think I'll just have to set
> margins on the outer div put a border on the inner one with display: 
> block.
> Was hoping for a more "contractive" effect rather than the regular
> "expansive" nature of the div element.

It's not what you're looking for, but here's a hack that seems to work 
in IE/Win 6, IE/Mac 5.2 and Safari 1.2.1, breaks firefox though:

.a {
	text-align: center;
}

.b {		
	display/**/: inline-block !important;
	display: inline;		
	border: 10px solid #eee;
}


The /**/ comment hack keeps IE/Mac from honoring the !important tag 
(IE/Win never honors it), but throws Firefox off too - not that it 
matters, my version doesn't seem to support inline-block anyway - and 
Firefox doesn't like that display:inline.  Could be a stepping stone, 
though.  As for a "contractive" div, css seems to hate contraction when 
you're working with dynamic content, sigh.

hth,

Adam



More information about the thelist mailing list