Bullets not appearing and a small menu error 1px off...

[rxbanditboy1112]

www.parrisstudios.com/hightower

 

ul {
margin: 15px 0px 0px 45px;
padding: 0;
list-style-type:none;
}

.small_bullets {
background:url('../assets/bulletSmall.gif') no-repeat 0 50%;
padding-left:20px;
font-weight:700;
padding-bottom:3px;
}

.large_bullets {
background:url('../assets/bulletLarge.gif') no-repeat 1px left;
padding-left:20px;
padding-bottom:10px;
display:block;
}

 

I have orange bullets with arrows next to all the entries near the bottom, but they aren't appearing consistently. If i open the page sometimes they appear on the bottom bullet. I minimize the screen and look at it about a minute later and half of them appear.... I don't get it. I feel like it has some sort of white space overlapping on top of them? Outlining in the developers plugin does nothing. This happens on firefox and IE.

 

Also on last 3 menu items the word and the divider dip down 1 px each. It is really noticeable when look at the divider and when you hover over them. Does anyone know why it would randomly drop down 1px. This only happens in firefox.

 

Thanks for all the help!

[phpQuestioner]

looks like the issue is right here:

 

margin: 15px 0px 0px 45px;

 

change it to:

 

margin: 0px 0px 0px 45px;

 

see if that helps - you also need to set your padding-bottom (for your <li> classes) to "0" - that should help too

[rxbanditboy1112]

I changed both... didn't help. Thanks though

[phpQuestioner]

set your <li> class margin to "0" - that may correct it.

[rxbanditboy1112]

i fixed the menu issue, the links above had padding to large.

[rxbanditboy1112]

That margin set to 0 didn't affect it.

 

I got it working in IE.... I floated the first set of bullets and some how that worked out. In Firefox it looks exactly the same.

[rxbanditboy1112]

I cheated and used tables for now. If you guys still want to help me work on the problem check out: www.parrisstudios.com/hightower/index2.htm

[TheFilmGod]

I recommend that you improve your coding style...

 

Instead of:

 

padding-top: 10px;
padding-bottom: 15px;
padding-left: 12px;

 

You can do this:

 

padding: 10px 0 15px 12px;