PDA

View Full Version : List item in box will not remove border



quartzy
Nov 20th, 2010, 03:36 AM
I have a menu box, with the id of box.
Whatever I try the border at the bottom of the last lilst will not go away. I have tried it all, can someone highlight where I am wrong.


#box {background: #fff; padding: 5px;}

ul.list2 li {
background-image: url('images/arrow_list_icon.jpg');
background-repeat: no-repeat;
background-position: left center;
padding: 3px 0 0 25px;
list-style-position: inside;
list-style: none;
}

ul.list2 li a
{text-decoration: none; border-bottom: 1px solid #999; display: block; width: 100%;}

#box.list2.last2 a {border-bottom: 0;}

DrDOS
Nov 20th, 2010, 03:48 AM
You don't assign the border to the a, but to the li itself. If you want the links to be neatly divided by a line you put the border at the top of the li and no border for the ul. When you assign the bottom border to the a it looks like an underlined link, which is what it really is.

quartzy
Nov 20th, 2010, 04:10 AM
Well you have not answered my questions, I still have the border even after removing the a . I only tried it on the a as I have tried everything and the thing will not go. Applying the border to the top wold pose the same problem for me

DrDOS
Nov 20th, 2010, 04:19 AM
Do you have it up somewhere so we can take a look at it?

quartzy
Nov 20th, 2010, 04:21 AM
I now have this
#box.list2.last2 li{border-bottom: 0;} like you suggest but it still does not work.
http://www.puddypaws.co.uk/test.html

teedoff
Nov 20th, 2010, 04:37 AM
which menu are you referring too?

quartzy
Nov 20th, 2010, 04:38 AM
its the white side box, not the navigation.

teedoff
Nov 20th, 2010, 04:40 AM
ok I dont see any style rule in your style sheet for:

.Last2 li {border: none;}

Do you use Firebug at all? You should really download it. It would save you a lot of time and headaches. It would also save you alot of time posting here..lol It finds mistakes that we often over look.

DrDOS
Nov 20th, 2010, 04:40 AM
I found it.

should be this #box .list2 .last2{border-bottom: 0;}

and not this #box .list2 .last2 ul{border-bottom: 0;}

.last2 is the ul you want to specify, there is not another ul inside it.

teedoff
Nov 20th, 2010, 04:45 AM
I found it.

should be this #box .list2 .last2{border-bottom: 0;}

and not this #box .list2 .last2 ul{border-bottom: 0;}

.last2 is the ul you want to specify, there is not another ul inside it.

Yep. And mine was wrong. it's late and Im tired and the heels just lost!!

I didnt write the rule correctly

quartzy
Nov 20th, 2010, 05:13 AM
Yes, thanks it now works, I did try it the way you wrote (and every other which way) but I got spaces mixed up between the classes.

teedoff
Nov 20th, 2010, 05:15 AM
Do you have and use firebug? You never said one way or another. You should really use it.

quartzy
Nov 20th, 2010, 02:43 PM
yes I do use FIrebug, but that does not help me with syntax errors.

teedoff
Nov 20th, 2010, 03:01 PM
Yes it does. Thats what its for. You can highlight a div or any other element on your page, see its style rules and see whether its correct or not. You should learn to use it properly. How do you think DrDos or myself saw that you didnt have a rule for .last2?

I'm only trying to help you get better at coding and code debugging.

quartzy
Nov 20th, 2010, 03:56 PM
I appreciate that, but the problem I had, was that my styles had incorrect syntax, and I am unsure of complicated syntax, such as what it was. I now know you need a space after each of the various segments. I did check with Firebug and it could not help me, unless you know differently, I'd be gald to know too.