List without bullets

[Howard Martin]

I have a page at http://www.develop.check.com.au/hols/ where I'm
trying to put a navigation strip on the left of the page. Try as I
may, I can't get rid of the bullets and move the list over to the
left.

The HTML is:
<ul>
<li><a href="area.html ?a=ah">Alexandr a Headland</a></li>
<li><a href="area.html ?a=ca">Caloundr a</a></li>
<SNIP>
</ul>

.... contained within a <DIV> to position it on the page.

The CSS is:

ul li a {
display: block;
list-style: none;
text-decoration: none;
width: 100%;
margin: 0;
padding-left: 4px;
color: #ffffff;
font-weight: bold;
background-color: #87714a;
border: 1px #666666 outset;
font-size: 11px;
}

ul li a:hover {
color: #4ba513;
}

TIA for a solution to this problem.

[Els]

Howard Martin wrote:

I have a page at http://www.develop.check.com.au/hols/
where I'm trying to put a navigation strip on the left of
the page. Try as I may, I can't get rid of the bullets and
move the list over to the left.

The HTML is:
<ul>
<li><a href="area.html ?a=ah">Alexandr a Headland</a></li>
<li><a href="area.html ?a=ca">Caloundr a</a></li>
<SNIP>
</ul>

... contained within a <DIV> to position it on the page.

The CSS is:

ul li a {
display: block;
list-style: none;

You set list-style:none to the a element here.

--
Els
http://locusmeus.com/
Sonhos vem. Sonhos vão. O resto é imperfeito.
- Renato Russo -

[Ståle Sæbøe]

Howard Martin wrote:

The CSS is:

ul li a {
display: block;
list-style: none;
text-decoration: none;
width: 100%;
margin: 0;
padding-left: 4px;
color: #ffffff;
font-weight: bold;
background-color: #87714a;
border: 1px #666666 outset;
font-size: 11px;
}
ul li a:hover {
color: #4ba513;
}

This only defines the style for the <a> element inside the <li> element
inside the <ul> element.

Try this:

ul, li, ul li a {
display: block;
list-style: none;
text-decoration: none;
width: 100%;
margin: 0;
padding-left: 4px;
color: #ffffff;
font-weight: bold;
background-color: #87714a;
border: 1px #666666 outset;
font-size: 11px;
}

ul li a:hover { color: #4ba513;
}

[Els]

Ståle Sæbøe wrote:

Howard Martin wrote:

The CSS is:

ul li a {

[snip]
This only defines the style for the <a> element inside the
<li> element inside the <ul> element.

Try this:

ul, li, ul li a {
display: block;
list-style: none;
text-decoration: none;
width: 100%;
margin: 0;
padding-left: 4px;
color: #ffffff;
font-weight: bold;
background-color: #87714a;
border: 1px #666666 outset;
font-size: 11px;
}

So you mean really set a padding-left of 4px for the ul, the
li, and the a? That's 12px padding-left all together. ;-)
Plus I think something will go wrong visually by setting all
those to 100% width...

--
Els http://locusmeus.com/
Sonhos vem. Sonhos vão. O resto é imperfeito.
- Renato Russo -
Now playing: David Bowie - Space Oddity

[Ståle Sæbøe]

Els wrote:

... Plus I think something will go wrong visually by setting all
those to 100% width...

Probably, but I did not feel like doing a CSS Tutorial writeup right
now ;)

All right Howard, you really should check out one of the many CSS
tutorials out there. Your question reveals that you are even more newbie
than me :D

[Kevin Scholl]

Howard Martin wrote:

I have a page at http://www.develop.check.com.au/hols/ where I'm
trying to put a navigation strip on the left of the page. Try as I
may, I can't get rid of the bullets and move the list over to the
left.

See if this helps you out:
http://css.maxdesign.com.au/listutorial/index.htm

The HTML is:
<ul>
<li><a href="area.html ?a=ah">Alexandr a Headland</a></li>
<li><a href="area.html ?a=ca">Caloundr a</a></li>
<SNIP>
</ul>

... contained within a <DIV> to position it on the page.

The CSS is:

ul li a {
display: block;
list-style: none;
text-decoration: none;
width: 100%;
margin: 0;
padding-left: 4px;
color: #ffffff;
font-weight: bold;
background-color: #87714a;
border: 1px #666666 outset;
font-size: 11px;
}

ul li a:hover {
color: #4ba513;
}

TIA for a solution to this problem.

--

*** Remove the DELETE from my address to reply ***

=============== =============== =============== =========
Kevin Scholl http://www.ksscholl.com/
ks*****@comcast .DELETE.net
------------------------------------------------------
Information Architecture, Web Design and Development
------------------------------------------------------
We are the music makers, and we are the dreamers of
the dreams...
=============== =============== =============== =========