ansaurus

Question

Answer 1

A:

.myclass {
    border-bottom: thin red dotted;
}

Graeme Perrow 2009-11-17 04:01:34

Its a dashed line, not dotted one.

rahul 2009-11-17 04:03:06

Fixed. I was mixing up dotted and dashed. Plus my answer would have given you a whole border rather than a single line.

Graeme Perrow 2009-11-17 04:05:59

Answer 2

+3 A:

Do you mean something like 'border: 1px dotted black'?

w3schools.com reference

ChssPly76 2009-11-17 04:01:54

Like <hr> but dotted.

Kaveh 2009-11-17 04:03:28

Answer 3

+3 A:

Found the answer here using Google search "css dotted lines":

<div class="horizontal_dotted_line"></div>

and in styles.css:

.horizontal_dotted_line{
  border-bottom: 1px dotted [color];
  width: [put your width here]px;
}

Brendan Long 2009-11-17 04:03:24

Answer 4

+3 A:

<style>
    .dotted {border: 1px dotted #ff0000; border-style: none none dotted; color: #fff; background-color: #fff; }
</style>
<hr class='dotted' />

rahul 2009-11-17 04:04:10

Answer 5

+2 A:

For example:

hr {
  border-top: 1px dotted #f00;
  color: #fff;
  background-color: #fff;
  height: 1px;
  width:50%;
}

See also Styling <hr> with CSS.

Sinan Ünür 2009-11-17 04:18:25

Thanks,this is ok,and for putting width?

Kaveh 2009-11-17 04:27:50

we can add e.g'width:50%;

Kaveh 2009-11-17 04:32:51

As IE 6 (can't remember for IE7) won't understand the "dotted" style, you can tell him to use "dashed" instead, using of course conditional comments to aim IE6 and no other browser.

Felipe Alsacreations 2009-11-17 11:18:12

Answer 6

A:

This is best cross browser solution

http://divitodesign.com/css/css-1px-dotted-border-bug-in-internet-explorer-6/

metal-gear-solid 2009-11-17 04:20:18

Answer 7

A:

add following line to the element you want to have dotted line.

style="border-bottom: 1px dotted #ff0000;"

Sarfraz 2009-11-17 07:28:33

ansaurus

tags:

views:

answers:

How to draw dotted line with css?

related questions