CSS Border

Discussion in 'HTML' started by Joshua Beall, Dec 1, 2003.

  1. Joshua Beall

    Joshua Beall Guest

    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
     
    Joshua Beall, Dec 1, 2003
    #1
    1. Advertising

  2. Joshua Beall

    brucie Guest

    brucie, Dec 1, 2003
    #2
    1. Advertising

  3. Joshua Beall

    Joshua Beall Guest

    "brucie" <> wrote in message
    news:bqe537$20rs4g$-berlin.de...
    > in post <news:Jvwyb.34547$>
    > Joshua Beall said:
    >
    > > 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"?


    Oops, yeah; sorry about that.

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

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


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

    -Josh
     
    Joshua Beall, Dec 1, 2003
    #3
  4. Joshua Beall wrote:

    > <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>


    --
    Toby A Inkster BSc (Hons) ARCS
    Contact Me - http://www.goddamn.co.uk/tobyink/?page=132
     
    Toby A Inkster, Dec 1, 2003
    #4
    1. Advertising

Want to reply to this thread or ask your own question?

It takes just 2 minutes to sign up (and it's free!). Just click the sign up button to choose a username and then you can ask your own questions on the forum.
Similar Threads
  1. Martin

    Datagrid Border with css

    Martin, Dec 15, 2003, in forum: ASP .Net
    Replies:
    0
    Views:
    447
    Martin
    Dec 15, 2003
  2. tshad
    Replies:
    0
    Views:
    2,276
    tshad
    Jan 31, 2005
  3. phl
    Replies:
    1
    Views:
    4,375
    Martin Jay
    Jun 8, 2006
  4. Coder
    Replies:
    1
    Views:
    712
    Cowboy \(Gregory A. Beamer\)
    Jun 24, 2006
  5. =?UTF-8?B?TWFydGluIFDDtnBwaW5n?=

    border-color: #003366; border-width: 2px;

    =?UTF-8?B?TWFydGluIFDDtnBwaW5n?=, Jul 17, 2006, in forum: HTML
    Replies:
    64
    Views:
    3,563
    Adrienne Boswell
    Jul 30, 2006
Loading...

Share This Page