(QUESTION) lining up border-bottom with padding-left:0.5em

Discussion in 'HTML' started by Steve Pugh, Feb 11, 2005.

  1. Steve Pugh

    Steve Pugh Guest

    Scott_From_PA <> wrote:

    >I can't seem to get the border-bottom-style to line up with the
    >padding-left: 0.5em.
    >What's the property that would line up the border-bottom with the
    >text?
    >
    >See below for clarificaton on this question
    >
    > h1 {
    > font-size:1.2em;
    > padding-left:0.5em;
    > border-bottom-width: 2px;
    > border-bottom-color: #CCCCCC;
    > border-bottom-style: dotted;
    > }
    >
    >This give me something link this
    >
    > Main Heading
    >…………………………………………………………
    >
    >Here's what I'm looking for.
    >
    > Main Heading
    > …………………………………………...
    >


    Use margin-left instead of padding-left

    Margin goes outside the box drawn by the borders and padding goes
    inside the box drawn by the borders.

    Steve

    --
    "My theories appal you, my heresies outrage you,
    I never answer letters and you don't like my tie." - The Doctor

    Steve Pugh <> <http://steve.pugh.net/>
     
    Steve Pugh, Feb 11, 2005
    #1
    1. Advertising

  2. Steve Pugh

    Oli Filth Guest

    Scott_From_PA wrote:
    > Guys,
    >
    > I'm defining the properties of <h1>
    >
    > I can't seem to get the border-bottom-style to line up with the
    > padding-left: 0.5em.
    > What's the property that would line up the border-bottom with the
    > text?


    Use margin-left instead.


    --
    Oli
     
    Oli Filth, Feb 11, 2005
    #2
    1. Advertising

  3. Guys,

    I'm defining the properties of <h1>

    I can't seem to get the border-bottom-style to line up with the
    padding-left: 0.5em.
    What's the property that would line up the border-bottom with the
    text?

    See below for clarificaton on this question

    h1 {
    font-size:1.2em;
    padding-left:0.5em;
    border-bottom-width: 2px;
    border-bottom-color: #CCCCCC;
    border-bottom-style: dotted;
    }

    This give me something link this

    Main Heading
    …………………………………………………………

    Here's what I'm looking for.

    Main Heading
    …………………………………………...



    got any ideas on how to achieve this?

    Thanks
     
    Scott_From_PA, Feb 11, 2005
    #3

  4. >Use margin-left instead.


    Got it, Thanks alot..

    S
     
    Scott_From_PA, Feb 11, 2005
    #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. Dan
    Replies:
    1
    Views:
    8,403
    ainigma
    Apr 4, 2008
  2. Noozer
    Replies:
    1
    Views:
    7,227
    Carolyn Marenger
    Mar 13, 2006
  3. phl
    Replies:
    1
    Views:
    4,386
    Martin Jay
    Jun 8, 2006
  4. Cuthbert
    Replies:
    8
    Views:
    454
    Ancient_Hacker
    Sep 13, 2006
  5. steve
    Replies:
    2
    Views:
    747
    steve
    Jul 5, 2007
Loading...

Share This Page