[thelist] Shrink wrapping a div?
Christopher Mahan
chris_mahan at yahoo.com
Fri May 14 09:42:13 CDT 2004
--- Ron Dorman <rwd at csi1st.net> wrote:
> Hi Max, take a look at this
> http://www.w3.org/Style/Examples/007/figures.html#XHTML and see if
> it
> helps any.
>
> Ron D.
>
>
> Maximillian Schwanekamp wrote:
>
> >I wrote:
> >-------------------------
> >--I am wanting to
> >
> >
> >>center a div of arbitrary width (depending on dynamic content),
> and give
> >>
> >>
> >it a
> >
> >
> >>border that just frames the content. Doing this with a
> fixed-width div is
> >>
> >>
> >no
> >
> >
> >>problem, but I am trying to style for a div of unknown precise
> width.
> >>
> >>In days of yore, I would wrap a table around the content, give it
> >>align="center" and call it a day. Well, for the border, there
> >>would be another table framing the first...
> >>
> >>
> >-------------------------
> >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.
Try this then:
<p class="a">
<span class="b">
Some text
</span>
</p>
.a{
text-align:center;
}
.b{
border: 1px solid #ff0000
}
You might need to fiddle with the padding and margins in the span.
=====
Christopher Mahan
chris_mahan at yahoo.com
818.943.1850 cell
http://www.christophermahan.com/
__________________________________
Do you Yahoo!?
SBC Yahoo! - Internet access at a great low price.
http://promo.yahoo.com/sbc/
More information about the thelist
mailing list