|
||||||||||||||||||||||||
|
CSS and IE7 Issues
Hey! Okay, so here is the deal. I just recently started getting into CSS and designing in a whole new way. So far im able to get things looking nice in Firefox, but once the page is opened up in IE7 it gets a little sketchy. I understand that this is a common issue with IE7... bastards...
I have a new CSS style sheet specifically for an IE7 browser and have that script thrown into the index file.
In FireFox my menu looks like this:
However when i open the page in ei7 i see this:
So I have this weird break at the bottom of the ie7 menu. Im not sure what to do in order to fix it. Ive tried to edit the padding and the sizing but nothing seems to be working... not only that, but the fact that the bullet drops out and the line border at the bottom is non-existent and the one above FAQ is twice the size... like its being stretched...
Any ideas on how to fix this???
| Attachment | Size |
|---|---|
| index.htm.txt | 1.99 KB |
| index2.htm.txt | 2.18 KB |
I could take a look at it
if you sent me the sources!
Here ya go! haha!
CSS
_____________________
#sidebar {
position:relative;
left: 20px;
width:230px;
background-color:#FFFFFF;
padding:10px;
float:left;
}
#sidetop {
position:relative;
background-image:url(img/sidetop.gif);
background-repeat:no-repeat;
left:4px;
top:10px;
width:212px;
height:31px;
clear:both;
}
#sidebottom {
position:relative;
background-image:url(img/sidebottom.gif);
background-repeat:no-repeat;
left:4px;
top:10px;
width:212px;
height:31px;
clear:both;
}
li {
background:url(img/bluebullet.png) left center;
background-repeat:no-repeat;
background-color:#FFFFFF;
display:block;
border-bottom:2px solid #c5dfed;
padding-left:20px;
padding-bottom:3px;
padding-top:3px;
}
ul {
list-style-type: none;
padding-left: 0;
margin-left: 0;
}
#links {
position:relative;
left:10px;
width:200px;
}
.class1 a {
font-family:Arial, Helvetica, sans-serif;
font-size:13px;
font-weight:bold;
letter-spacing:-0.5px;
text-decoration:none;
text-transform:uppercase;
color:#1781b9;
}
.class1 a:hover {
font-family:Arial, Helvetica, sans-serif;
font-size:13px;
font-weight:bold;
letter-spacing:-0.5px;
text-transform:uppercase;
color:#73b5d8;
}
HTML
_____________________
div id=sidebar
div id=links
ul
span class=class1
li a href="why.htm" Why RemarkableAgents? /a /li
li a href="start.htm" Getting Started /a /li
li a href="fvi.htm" What Is FVI? /a /li
li a href="templates.htm" Website Templates /a /li
li a href="testimonials.htm" Testimonials /a /li
li a href="radio.htm" RemarkableRadio /a /li
li a href="faq.htm" FAQ's /a /li
/span
/ul
/div
div id=sidetop /div !-- these divs are just images--
div id=homevalue /div
div id=rnews /div
div id=preapprove /div
div id=rradio /div
br
div id=sidebottom>/div
/div
all good here
the attached html file (which includes the css you sent me) renders the same way on firefox and IE7 over here. Check it over there as well and if the problem does not appear, then I suspect it may have to do with image positioning; so you would have to send me everything by attaching a zip with source, pics, etc.
???
Looks like this code is from the blog page... either that or im getting something wrong... i dont think it came through right...
however, i am happy that someone got it to work! haha!
yeah, the blog removes tag symbols
but I replaced them and the code that I was working with is here: css problem
Odd...
Hmmm, maybe its a server issue... b/c what I am looking at is on our local server... It didnt look like much was changed, but what was changed got replaced and it still is looking the same way... What a mess IE7 is... and pointless as well... So yeah, back to the drawing board unless you have any other ideas?
just send me this
the html source as it is received by IE7 (IE7 menu -> View -> Source) along with the css file (if the style declarations are not inline or in the same page)
Sent...
to your f_bass account.
how about this?
if you don't mind moving the span outyside the ul, then look at index2 attachment on this page. Putting a span within a ul seems to confuse IE7.
Post new comment