CSS Border

[Joshua Beall]

Hi All,

I have a border around some text. Here is what the code currently looks
like:

<div class="incompleteForm">You did not fill out the following required form
fields:<em>name, email, data</em></div>

The incompleteForm class is set to:

..incompleteForm
{
margin: auto auto;
padding: 4px 0px;
text-align: center;
border: 1px dashed #DD0000;
}

Now, here is a shot of what this looks like when rendered in Mozilla and IE6
(see link below). As you can see, there is a lot of empty space to the left
and right of the text. I would prefer that the box scale to fit around the
box nicely. Is there a way to do this? I could set it to an absolute pixel
value, but then I'd prefer to have it liquid, just consuming the amount of
space necessary.

http://jbeall.us/media/images/border.png (you can also see this, and the
actual code, by hitting submit in the guestbook
(http://jbeall.us/pages/guestbook/), leaving at least one of the fields
blank.

Any help?

-Josh

 

[brucie]

As you can see, there is a lot of empty space to the left and right of
the text. I would prefer that the box scale to fit around the box
nicely.

i assume a typo. "box around the text nicely"?

Is there a way to do this?
http://jbeall.us/media/images/border.png

http://stuff.bruciesusenetshit.info/border-thingy.html

 

[Joshua Beall]

i assume a typo. "box around the text nicely"?

Oops, yeah; sorry about that.

http://stuff.bruciesusenetshit.info/border-thingy.html

Wow, thanks, that is exactly what I was looking for. Much obliged!

-Josh

 

[Toby A Inkster]

<div class="incompleteForm">You did not fill out the following required form
fields:<em>name, email, data</em></div>

The incompleteForm class is set to:

.incompleteForm
{
margin: auto auto;
padding: 4px 0px;
text-align: center;
border: 1px dashed #DD0000;
}

Try:

..incompleteForm
{
margin: auto auto;
text-align: center;
}

..incompleteForm span {
padding: 4px 0px;
border: 1px dashed #DD0000;
}

<div class="incompleteForm"><span>You did not fill out the following
required form fields:<em>name, email, data</em>.</span></div>