the header is in the wrapper, the header holds the nav. the header sites fine in syllabus but not in index. basically I have a 30px shift I could make the header come back 30px on index but then syllabus will be out.
I can't seem to see this one today.
any ideas?
if anyone says don't code for IE7, I will come round your house and shoot you in the face with an x-ray gun until you cry for your mum.
<script type=\"text/javascript\" language=\"javascript\" src=\"js/jquery-1.2.6.min.js\"></script> <script type=\"text/javascript\"> /*** Simple jQuery Slideshow Script Released by Jon Raasch (jonraasch.com) under FreeBSD license: free to use or modify, not responsible for anything, etc. Please link out to me if you like it :) ***/ function slideSwitch() { var $active = $('#banner IMG.active');
if ( $active.length == 0 ) $active = $('#banner IMG:last');
// use this to pull the images in the order they appear in the markup var $next = $active.next().length ? $active.next() : $('#banner IMG:first');
// uncomment the 3 lines below to pull the images in random order
// var $sibs = $active.siblings(); // var rndNum = Math.floor(Math.random() * $sibs.length ); // var $next = $( $sibs[ rndNum ] );
I added that script to the syllabus page with no effect.
my css is split as in IE7 has its own, only a couple of differences. however, I have noticed that the header will not sit in the centre, here is my CSS for the header:
#header { position:fixed; display:block; top:0px; width:960px; height:80px; margin: 0 auto 0 auto; /* to get everything centre */ text-align:center; /* to get IE centre */ /*margin-left:-30px; /*IE 7 Only makes index page sit perfect*/ background-color:#5b5b5b; z-index:100; }
First of all I would try to put the #banner inside the #content div. Then you will also need to change its "top"-property to auto (or remove it) and change its "margin"-property to something like "0 auto 25px" for a better bottom-spacing.
Other solution (you can leave the div where it is) which I was actually able to test myself with the developer toolbar (I hope you have this) and which works in IE7 (no other browser tested):
#banner { width: 956px // full width (960px) minus (2x) 2px border }
#banner img { left: 30px; // this will center the images again }
But I would go for the first solution if I were you.
I think the problem has something to do with the width of the #wrapper-div which gets messed up by IE and to be 100% sure I would need to FULLY inspect your markup and css. Speaking of your markup/css, I think you use many unneeded properties and also at least some unneeded html markup. Doing so always makes things more complicated.
How I found out: Setting "display: none" to suspicious elements in the developer toolbar in IE7. Doing that with the #banner-div removes the problem kinda and you can go on from there. It's always a good idea to (temporarily) remove chunks of html/css to test/find bugs which break the "frame" of a site so you can target the div/elements.
My CSS for IE8, FF, Opera, Chrome, Safari works fine, but the CSS for IE7 does not.
I have 2 working pages so far.
http://www.woskf.co.uk/new/index.php
http://www.woskf.co.uk/new/syllabus.php
the header is in the wrapper, the header holds the nav.
the header sites fine in syllabus but not in index. basically I have a 30px shift
I could make the header come back 30px on index but then syllabus will be out.
I can't seem to see this one today.
any ideas?
if anyone says don't code for IE7, I will come round your house and shoot you in the face with an x-ray gun until you cry for your mum.
Don't code for IE7? HA! People should still be coding for IE6. Lazy sods.
I'll have a look at the code after the morning rush has died down here.
IE6 can wait till I got the main modern browser finished.
It's the only thing different between the pages.
my css is split as in IE7 has its own, only a couple of differences. however, I have noticed that the header will not sit in the centre, here is my CSS for the header:
Other solution (you can leave the div where it is) which I was actually able to test myself with the developer toolbar (I hope you have this) and which works in IE7 (no other browser tested):
But I would go for the first solution if I were you.
I think the problem has something to do with the width of the #wrapper-div which gets messed up by IE and to be 100% sure I would need to FULLY inspect your markup and css. Speaking of your markup/css, I think you use many unneeded properties and also at least some unneeded html markup. Doing so always makes things more complicated.
How I found out: Setting "display: none" to suspicious elements in the developer toolbar in IE7. Doing that with the #banner-div removes the problem kinda and you can go on from there. It's always a good idea to (temporarily) remove chunks of html/css to test/find bugs which break the "frame" of a site so you can target the div/elements.