CSS - Dashed line going through my content....

  Ade_1 21:04 12 Oct 2006


I was wondering if anyone could shed any light on the current problem im facing. In IE there is a dashed line which I believe is related to #nav li as when I take off the bottom border for the nav bar the line disappears. If you dont fully understand what im getting at please take a look - click here

If anyone could suggest how to rectify this problem that would be very helpful.

Thanks in advance


  PurplePenny 21:57 12 Oct 2006

Only took a quick look but I your <li>s are not inside a set of <ul> or <ol> tags. Maybe that is confusing IE because it doesn't know that the list has finished.

  Ade_1 17:49 13 Oct 2006

I have managed to solve it with the help of "PurplePenny" It did shift stuff about however so I popped in an IE "hack" which I believe was -
* html #nav li{ /*IE only rule.*/
padding-right: 14px;
margin-right: 2px;

However im not sure as ive had to use one or two...

  Ade_1 18:09 13 Oct 2006

I have another small problem. You will be able to see when you go on the link that the last navigation word repeats itself. I am unable to find out why it is doing this... I have tried messing around with padding margins etc but I have come to a standstill and I am unable to sort it.

If anyone could help with this new problem it would be greatly appriciated.

Thanks in advance


  Ade_1 20:33 13 Oct 2006

I have managed to solve this problem by...

editing the padding, I edited the bit of padding which I had used a "hack" for. Although the dashed underlines are touching the main content its no big deal, its near enough touching, only a few pixels out.


  PurplePenny 20:45 13 Oct 2006

Weird! I wonder why it happened. I was just trying it in Opera and IE7 but you may already have solved it by the time I opened both of those.

Now there is another problem in IE7: the dashed lines stick out into the text (by three dashes so it is quite noticeable)! (Which is also weird because the dashed line is just the border isn't it?)

BTW - you have two <h1>s on a page: there should only be one. Make the second one h2 and if you want it the same size as h1 style it the same in the CSS.


  Ade_1 20:58 13 Oct 2006

O, I never checked it in IE 7... Primaraly because I dont have IE 7 on this machine and I would rather keep IE 6 until IE 7 is released in the automatic update. I do have IE 7 on my Vista machine but I need to be able to test my sites in IE 6.

Regarding the two <h1>s, they are defined differently in the CSS, as one is #masthead h1 and the other is #content h1. Or should I just not use two <h1>s regardless?



  PurplePenny 22:10 13 Oct 2006

There should only ever be one h1 on a page.

h2s should be subheadings of hi; h3s subheadings of h2s and so on.

This allows users with the appropriate technology to browse a page via the headings. It is useful for people using screen readers and people with limited movement (e.g. sip& puff users) who find scrolling around a page tiring.

  Ade_1 23:06 13 Oct 2006

Ok, thanks for the advice Penny. I shall change that tomorrow :)


This thread is now locked and can not be replied to.

Elsewhere on IDG sites

iMac Pro review

See iconic duo Smith and Foulkes' epic animation for the BBC's Winter Olympics coverage

iMac Pro review

Idées cadeaux pour geeks et tech addicts