«

Hi,

I'm playing with my website (http://www.all-the-johnsons.co.uk) which is
starting to take shape (loads of broken links, but the material is there,
just needs linking around).

I'm having a problem though with the list on the left. Under Mozilla, the
yellow background fills the entire portion of the screen to the left of
the dashed line. IE 6 has a gap which is annoying!

The other problem is that I wish to reduce the spacing between the li
elements so instead of

> something
> next

I have

> something
> next

I have tried

ul li ul { padding-left: 15px; }

which is fine under Moz, but does nothing under IE 6.

Any suggestions would be appreciated. The style sheet validates as does
the index.html file (well, it did about 30 mins ago!)

TTFN

Paul

"Paul F. Johnson" <paul@spammersahoy!.co.uk> wrote:

>I'm playing with my website (http://www.all-the-johnsons.co.uk) which is
>starting to take shape (loads of broken links, but the material is there,
>just needs linking around).
>
>I'm having a problem though with the list on the left. Under Mozilla, the
>yellow background fills the entire portion of the screen to the left of
>the dashed line. IE 6 has a gap which is annoying!

Um, in IE6 I see the yellow background overlapping the dashed line.

>The other problem is that I wish to reduce the spacing between the li
>elements so instead of
>
>> something
> > next
>
>I have
>
>> something
> > next
>
>I have tried
>
>ul li ul { padding-left: 15px; }
>
>which is fine under Moz, but does nothing under IE 6.

Actually it adds to the indent in IE6.

The different browser use different combinations of padding and margin
on UL and LI to position the bullets. You need to set all the values,
not just one of them, to achieve more or less consistent cross browser
sesults.

This may be helpful: http://steve.pugh.net/test/test37.html

I'd suggest starting with
ul {margin-left: 0; padding-left: 0;}
li {margin-left: 15px;}

and tweaking that last value until you're happy. Be sure to hide all
the above from NN4.

Steve

--
"My theories appal you, my heresies outrage you,
I never answer letters and you don't like my tie." - The Doctor

Steve Pugh <> <http://steve.pugh.net/>

Hi,

On Tue, 25 Nov 2003 15:35:58 +0000, Steve Pugh wrote:

> "Paul F. Johnson" <paul@spammersahoy!.co.uk> wrote:

>>I'm having a problem though with the list on the left. Under Mozilla, the
>>yellow background fills the entire portion of the screen to the left of
>>the dashed line. IE 6 has a gap which is annoying!
>
> Um, in IE6 I see the yellow background overlapping the dashed line.

I get a gap between the yellow background and the dashed line at 800 x
600. That said, there is a definate flakiness about IE 6 - have a look at
http://ahnews.music.salford.ac.uk/riscstation at a resolution > 1024 x 768
and watch the formatting explode into a great horrible mess!


> I'd suggest starting with
> ul {margin-left: 0; padding-left: 0;} li {margin-left: 15px;}

That's great - thanks. I'll look at the website as well

TTFN

Paul