[css-d] bullet list problem in Safari, IE; space in IE
I am trying to solve a problem with bullets in a list, and some
spacing problems.
On this page: http://tinyurl.com/289um4
in Firefox, the bullets in front of Read all about... and Contact:
(510)... show up fine in Firefox (Mac, PC), but not in Safari (Mac)
or IE (PC).
The CSS is here: http://tinyurl.com/2xxcm7
I have a few things going on with lists on the page -- I'm using
lists for the top nav, and have this global style:
ol, ul {
list-style-type: none;
list-style-image: none;
list-style-position: outside;
}
The items where the bullets don't appear are in the .list01 class:
.list01 li {
padding: 0px 0pt 0px 14px;
background: url(_img/bullet-nav.gif) no-repeat scroll 5px 50%;
display: block;
}
Why do the list bullets not show in IE/Safari as they do on Firefox?
How can I get them to show?
And, another issue related to IE 6: I have two divs stacked in the
header to create the double line (one dotted, one solid). They are
correctly 1px apart in Firefox and Safari and IE7, but in IE6,
there's a big gap between the lines. Any ideas how to fix?
Lastly, I have attached the page-bottom curved image by using div
id=pageBottom. I was only able to get it to attach to the white
page div above it by giving it a -1.6em top margin. While this
works, I distrust my method. Any tips on how to get that div/image in
place (touching the page div so the borders attach) in a better way?
__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
List policies -- http://css-discuss.org/policies.html
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
[css-d] list bullet not showing; spacing in IE6
I am trying to solve a problem with bullets in a list, and some
spacing problems.
On this page:
http://www.sparklejet.com/clients/graybrech/_dev/mockups/home01/
the bullets in front of Read all about... and Contact: (510)...
show up fine in Firefox (Mac, PC), but not in Safari (Mac) or IE (PC).
The CSS is here:
http://www.sparklejet.com/clients/graybrech/_dev/mockups/home01/
style.css
I have a few things going on with lists on the page -- I'm using
lists for the top nav, and have this global style:
ol, ul {
list-style-type: none;
list-style-image: none;
list-style-position: outside;
}
The items where the bullets don't appear are in the .list01 class:
.list01 li {
padding: 0px 0pt 0px 14px;
background: url(_img/bullet-nav.gif) no-repeat scroll 5px 50%;
display: block;
}
Why do the list bullets not show in IE/Safari as they do on Firefox?
How can I get them to show?
And, another issue related to IE 6: I have two divs stacked in the
header to create the double line (one dotted, one solid). They are
correctly 1px apart in Firefox and Safari and IE7, but in IE6,
there's a big gap between the lines. Any ideas how to fix?
Lastly, I have attached the page-bottom curved image by using div
id=pageBottom. I was only able to get it to attach to the white
page div above it by giving it a -1.6em top margin. While this
works, I distrust my method. Any tips on how to get that div/image in
place (touching the page div so the borders attach) in a better way?
Thanks for any help.
__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
List policies -- http://css-discuss.org/policies.html
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
[css-d] floated image is offset in Firefox only; why?
On this page: http://www.sparklejet.com/clients/cale/livingroom/ the logo, which is in a float-left div, renders in Firefox (both Mac and Windows) exactly 17 pixels below where it should be. That is, the float seems to be in the right place in Firefox, but the image in the float -- the GIF logo with a transparent background -- is offset 17 pixels down. I have made the background of the float red to emphasize the offending offset (it looks terrible at the moment). It renders fine in Safari, Explorer 6 and 7. CSS is here: http://www.sparklejet.com/clients/cale/_css/style.css Any advice on how I can modify my coding of HTML/CSS to get the logo to eliminate the image offset in Firefox? What am I doing wrong? I have tried to keep my code as clean as I could, and I generally avoid overly-sophisticated hacks. Thank you in advance for any help. __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
