Check this out:



It looks like this:

______________________________

But I would like it to look more like this:

------------------------------

Is it possible, and if so, how do I change it?

It will change other lines to but give it a try if you wont

Code:

.h3, h3 {
    border-bottom: 1px dotted #0076B1;
}

Try adding it, if it doesn't go well find this rule and EDIT IT (change solid to dotted).

It works. Too bad, it looks like this:

..............................

And not like this:

------------------------------

Isn't it possible to have it like that?

Yes, please add this code instead:

Code:

.h3, h3 {
    border-bottom: 1px dashed #0076B1;
}

Works.

Now, before locking this thread:

Is there any other options out there? Like having squares, or similar? Or is it only the "solid", "dotted", and "dashed" out there?

Thanks.

There are many other options out there, however there is no such option to make it squares or similar.

Like... could you... name 3 more?

I can name you some, but they won't have any effect on the line itself.

Some examples include "ridge", "groove" and "double".

Yup. "Ridge", and "double" didn't change anything.

"Groove", did, though.

Is there any list somewhere with all names? I would like to try some more.

(... And if it isn't, I guess you will have to be spending your day writing them all.)

Edit: They did actually change the line. I just had to chance the number of pixels.

Really? It must have changed its colour because I couldn't see a really big difference on my screen.

There isn't a list out there that I know of, but I've been through all the possible options and most of them (99 %) will not have an effect.