my Vigilance css and ie6,7
-
I did some css editing on my blog (theme:Vigilance) to make the header look smaller and thinner, and I’m not sure
what I’ve done exactly but it looks like whatever I did worked, at least with chrome and firefox and the newer versions of IE and Safari.
the header looks wrong on IE7 image 1 , and a lot of things looks wrong in IE6 image 2 , I’m fed up with it and I have no idea how to fix it, I hope I can do something to make it work at least with IE7,If you have any idea about this please help!
The blog I need help with is: (visible only to logged in users)
-
-
Try this:
Remove this selector:
#content { margin-top:-80px; }In the “#sidebar” selector, remove this property:
margin-top:-80px;Replace these selectors:
#header { height:70px; background-image:url('http://spocrep.files.wordpress.com/2009/09/20-09-1430-04-54-26-d9856.png'); background-repeat:repeat-x; } #nav { float:right; font-size:20px; height:33px; position:relative; top:-74px; font-family:Tahoma, "Times New Roman",Arial, Serif ,Sans-serif,Monospace; display:block; } h1#title a,h1#title a:hover,div#title a,div#title a:hover { height:70px; top:-74px; position:relative; padding:20px 0 0; }with these:
#header { border: none; height:160px; background: #fff url(http://spocrep.files.wordpress.com/2009/09/20-09-1430-04-54-26-d9856.png) 0 0 no-repeat; padding: 0; overflow: hidden; clear: both; } #nav { float:right; font-size:20px; height:33px; margin: 25px 0 0; font-family:Tahoma, "Times New Roman",Arial, Serif ,Sans-serif,Monospace; display:block; } #title { border-bottom: 5px solid #000; height: 90px; width: 100%; } #title a {margin: 0;}That’s it.
-
Wow! thank you so much that was very good, I don’t believe it!
there’s one little thing, it looks better in ie7 except for the header: http://spocrep.files.wordpress.com/2010/06/ie-7.png
and in Ie6: http://spocrep.files.wordpress.com/2010/06/ie6.png
how can I fix that? :) -
That is weird… it looks right on my test blog… try this, though:
In your “#header” selector change this:
background: #fff url(http://spocrep.files.wordpress.com/2009/09/20-09-1430-04-54-26-d9856.png) 0 0 no-repeat;to this:
background:#fff url('http://spocrep.files.wordpress.com/2009/09/20-09-1430-04-54-26-d9856.png') top right no-repeat;lemme know.
-
it did fix it, except now the navbar Dosen’t Show Up in ie7 and ie6: http://spocrep.files.wordpress.com/2010/06/no-nav2.png
-
I so hate IE….
I need to replicate your settings so that I can test this fully. It shouldn’t be the cause but maybe because your language is Arabic, the encoding type might be messing things up.
Let me fire up my virtual machine where I have IE 7 and I will let you know further info.
-
-
Ok, do whatever you would like i’m ready to try anything
and I just wanna say you really have been a big help, I appreciate everything you did, thank you so much :) -
-
-
if we made the navbar <div style=”display: inline; height: auto; position: absolute; visibility: hidden; width: auto; “>centered </div>centered would that solve it?
-
-
That’s weird…. IE 7 displayed it well…
Yes, I like your approach and maybe position:absolute would be a better solution.
Since you cannot change the source, the code you posted won’t work, however, give this a try:
Add this to the #header selector:
position: relative;and replace the #nav selector with this:#nav {
position: absolute;
height: 33px;
right: 0;
bottom: 5px;
}
` -
-
Are you previewing or saving? sometimes, and this is a quirk, you have to actually save your changes to see them; previewing is just not enough.
-
I know I save it, but I test it not only on the browser I’m using (chrome) but also using this software called IE tester.
-
I’m really stumped… I haven’t been this stumped in a long time.
Let me have something to eat and I’ll see what else I can do.
- The topic ‘my Vigilance css and ie6,7’ is closed to new replies.