Make borders hug text?

admin

Administrator
Staff member
I can put a border around a paragraph... but I want the border to hug the text - so if the text is not a full line long, and it's centerd in the page, the border looks like a box around the text.

Here is the class code so far:

p.exhibitt {text-align:center; font-size:16px;font-weight:bold;width:auto;border:1px solid #999;}


Any thoughts?It seems that when you use a tag that is a BLOCK object, you get a full page width box. Using P or DIV does the same thing. Using SPAN the box is tight to the text but it is not centered.

One way to work-around it would be to place the text in a SPAN and apply the border attribute to the SPAN. Then place the SPAN inside a P and apply the center attribute to the P.
<style type="text/css">
.boxp {
text-align:center;
}
.boxs {
font-size:16px;
font-weight:bold;
width:auto;
border:1px solid #999;
}
</style>
...
<p class="boxp"><span class="boxs">this is some text</span></p>I'll try that out! Looks like a good way to do it!

JohnOriginally posted by Bigjohn
I'll try that out! Looks like a good way to do it!

John

Just FYI: works like a charm.

Many thanks.
 
Back
Top