making a dashed line separator in css

Discussion in 'Web Design and Development' started by demarcopbl, Aug 7, 2009.

  1. demarcopbl macrumors member

    Apr 28, 2009
    hello all, been working on a new site layout and have run into a problem. I had been including white space and a dashed 'line break' at the bottom of my uploaded images so that when they appear on the site, it separates the images from the text. Now I have added rollovers different to the background color, you can clearly tell my workaround. Is there any way to do the line break/padding with css? basically I want the line to be the same length as the base of the image. See attached screens for reference. Thanks, Mike.

    Attached Files:

  2. angelwatt Moderator emeritus


    Aug 16, 2005
    You can do it with the border property
    [I]selector[/I] {
     border-bottom: 1px dashed #000;
    Can use dotted as well.
  3. wheezy macrumors 65816


    Apr 7, 2005
    Alpine, UT
    Bingo! CSS can do quite a lot, and once CSS3 is a full accepted standard (ahem, IE) you'll be able to do even more.
  4. demarcopbl thread starter macrumors member

    Apr 28, 2009
    thankyou angelwatt!!

    thanks for the tip, worked like a charm. Appreciate your input.

Share This Page