text in DIV with border on top, move text away from border downward

Posted on 2011-05-12
Last Modified: 2012-05-11
In attached code, the text is basically touching the top border of the DIV. I want to bump it down 4 pixels. Adding a margin-top moves the border and the text down. Adding a padding-top appears to do nothing. What is the correct way to do this? Thank you!
#exerciselist {margin: 0px 0px 9px 0px; padding 0px; width: 173px; border-top: 1px solid #c8cfd0;}

<div id="exerciselist">Exercise List</div>

Open in new window

Question by:bbdesign
    LVL 21

    Accepted Solution

    LVL 2

    Assisted Solution

    try this,

    #exerciselist {margin: 0px 0px 0px 0px; padding-top: 15px; width: 173px; border-top: 1px solid #c8cfd0;}

    Open in new window


    Author Comment

    Ah, darn it. So I was correct, padding-top is the right way to do it. I had a typo in my syntax:

    padding 0px

    Was missing the colon!

    padding: 0px

    Thanks anyway.

    Write Comment

    Please enter a first name

    Please enter a last name

    We will never share this with anyone.

    Featured Post

    Looking for New Ways to Advertise?

    Engage with tech pros in our community with native advertising, as a Vendor Expert, and more.

    Most web designers often experience crossbrowser issues during interface design / development.  On common problem is with Internet Explorer due to its rendering discrepancies between previous versions.  Here are some techniques I use to help avoid c…
    Unordered lists (HTML ul tags) are very handy to create menus of all types, shapes and sizes.  All it takes is a little knowledge of CSS and the possibilities are endless. First off, you should know the general format for menus created using the …
    In this tutorial viewers will learn how to define a gradient in CSS. Create a new HTML document with an internal stylesheet.: Create a div in CSS and name it Gradient. Define the background as "linear-gradient(to right, #ee3668, black)". Ensure you …
    In this tutorial viewers will learn how to style different bullet points for unordered lists in CSS. Begin with a normal unordered list; the default bullet point is a solid circle: In the CSS, create a defined class of unordered list by typing "ul.S…

    760 members asked questions and received personalized solutions in the past 7 days.

    Join the community of 500,000 technology professionals and ask your questions.

    Join & Ask a Question

    Need Help in Real-Time?

    Connect with top rated Experts

    12 Experts available now in Live!

    Get 1:1 Help Now