Can I import more than two stylesheets for a background

liunx · Jan 9, 2008

Hi 
 
I am trying to design a site, which for various reasons has had to be done in frames. Everything works ok, except for one thing. 
 
My background is split between 2 frames, and needs to be aligned. One of the frames scrolls, and one does not. My problem is that I can get the background to look fine in ie5, but in ie6, and ns6, it does not align. 
 
Is it possible, therefore, to have 3 stylesheets - one for NS$, 1 for ie6 and ns6, and one for everything else? 
 
Thanks for any possible answers!! 
 
Marj

here's a script i used to use. it's not the most all-encompassing, but it should work. 
 
 
<script language="javascript"> 
IE5 = (document.all && !document.getElementById) ? true : false; 
NS4 = (document.layers) ? true : false; 
IE6 = (document.all && document.getElementById) ? true : false; 
N6 = (document.getElementById && !document.all) ? true : false; 
 
if(navigator.userAgent.indexOf('Win') != -1) 
{ 
if (IE5 || IE6) 
{ 
document.write("<link rel=\"stylesheet\" href=http://www.htmlforums.com/archive/index.php/\"win_msie.css\">"); 
} 
else if (N6) 
{ 
document.write("<link rel=\"stylesheet\" href=http://www.htmlforums.com/archive/index.php/\"win_ns6.css\">"); 
} 
else 
{ 
document.write("<link rel=\"stylesheet\" href=http://www.htmlforums.com/archive/index.php/\"win_other.css\">"); 
} 
} 
else if(navigator.userAgent.indexOf('Mac') != -1) 
{ 
document.write("<link rel=\"stylesheet\" href=http://www.htmlforums.com/archive/index.php/\"mac.css\">"); 
} 
else 
{ 
document.write("<link rel=\"stylesheet\" href=http://www.htmlforums.com/archive/index.php/\"other.css\">"); 
} 
</script>Thanks for your fast response, Trans. Will give it a try and let you know how I get on! 
 
Majcool. you'll notice that i'm not even using the NS4 part of it, and once i get to the Mac, i don't even bother checking the browser, so modify away! 
 
also, i'm lumping IE5 + IE6 together, which you probably don't want, so you may want to separate them. 
if (IE5) 
{ 
document.write("<link rel=\"stylesheet\" href=http://www.htmlforums.com/archive/index.php/\"win_msie5.css\">"); 
} 
if (IE6) 
{ 
document.write("<link rel=\"stylesheet\" href=http://www.htmlforums.com/archive/index.php/\"win_msie6.css\">"); 
}...something like that.Trans, 
 
I've just found out that this works fine in all of the browsers on my computer, but on the same browsers in another computer, the backgrounds are slightly out. I Download ed ie6 especially, and there is no problem on my computer! 
 
So, it would seem that it is some sort of difference in monitor size,(Resolution is the same), or something else. It's really got me stumped!! 
 
Anyway, I have got various people looking at it on different computers/monitors/ browsers etc, so hopefully I might be able to work out what's wrong. The page I am looking at is <a class="postlink" href="http://www.angliacouriers.co.uk/new/ema.html">http://www.angliacouriers.co.uk/new/ema.html</a> 
if you would care to take a look. 
 
Thanks for your help so far. 
 
Majthe background wasn't aligned on my screen (1024x768 17inch ie), threw your page into dreamweaver and saw that the td wasnt aligned with the td of the main section (have a look at the snapshot), don't know if this will change anything but try changing the td width to 77%: 
 
<TD vAlign=top width="77%" height=47> 
<CENTER> <IMG height=50 src=http://www.htmlforums.com/archive/index.php/"titleemainfo_files/abusema2.gif" 
width=288> </CENTER></TD>Thanks Leo, 
 
Will give it a try and see how it looks - it's so frustrating as it looks ok on my computer, but I know there's something wrong. 
 
Let you know how I get on!! 
MajNicely coded. Only one [error (<a class="postlink" href="http://validator.w3.org/check?uri=http%3A%2F%2Fwww.angliacouriers.co.uk%2Fnew%2Femainfo.html&charset=%28detect+automatically%29&doctype=HTML+4.01+Transitional&ss=1&outline=1&sp=1">http://validator.w3.org/check?uri=http% ... ine=1&sp=1</a>)] on the main frame, and three [errors (<a class="postlink" href="http://validator.w3.org/check?uri=http%3A%2F%2Fwww.angliacouriers.co.uk%2Fnew%2Ftitleemainfo.html&charset=%28detect+automatically%29&doctype=HTML+4.01+Transitional&ss=1&outline=1&sp=1">http://validator.w3.org/check?uri=http% ... ine=1&sp=1</a>)] on the other frame (but the first two can be ignored). 
 
The frameset page does need to be [tidied up (<a class="postlink" href="http://validator.w3.org/check?uri=http%3A%2F%2Fwww.angliacouriers.co.uk%2Fnew%2Fema.html&charset=%28detect+automatically%29&doctype=HTML+4.01+Frameset&ss=1&outline=1&sp=1">http://validator.w3.org/check?uri=http% ... ine=1&sp=1</a>)] a bit though. 
 
 
You'll need to manually validate your CSS at <a class="postlink" href="http://jigsaw.w3.org/css-validator/validator-uri.html">http://jigsaw.w3.org/css-validator/validator-uri.html</a> as the automatic checker cannot find your style sheets, see this [link (<a class="postlink" href="http://jigsaw.w3.org/css-validator/validator?uri=http%3A%2F%2Fwww.angliacouriers.co.uk%2Fnew%2Fema.html&warning=1&profile=css2">http://jigsaw.w3.org/css-validator/vali ... ofile=css2</a>)].Thanks for that Giz - I have tried to change the errors, and tidy up the frameset, but I still have the problem where there is a 3 pixel difference between the background in the top frame , and the right frame, and I can't seem to get round it. 
 
Once this is sorted, I can check all my HTML/CSS etc. 
 
MajHi 
 
I think I've fixed this problem abit of an alteration to your suggestion, Leo - I made all widths etc exactly the same in both frames, and my sources tell me that the slight kink in the blue bar has gone. 
 
Thank you all very very much for your help - this problem has been driving me nuts for days!! 
 
Majyep it's ligning up beautifully now, well done!

Maj, it is still misaligned under IE 6 and phoenix on a 15 inch monitor @ 1024 x 768. sorry

NOOOOOOOO!! What can I do???? Help!!! 
 
Anyone got any ideas......... 
 
MajAre you sure you really need frames and can't go with tables instead?My father has changed the width of the scrollbars in the control panel (windows), he made the scrollbars thicker. That's why it still a few pixels over for me. 
But, try this: The blue picture in the top frame seems to be a right-aligned background image. If it wouldn't be there as a background image but as a normal right-aligned <img> instead, you could change the top frame's scrolling to auto and something neat would happen in IE. Try changing your scrollbars thicker, in Windows right-click on the desktop and click "Properties" and then try this out....you would need to do the same with the blue picture at right in the main frame too.Hi All, 
 
Finally discovered what it was, thanks to agent - it would seem that some settings on Control Panel/Displays have a slightly wider scrollbar than others, so it will be ok in one person's browser, but not another. 
 
So, it's back to the drawing board for the background! 
 
Crobe - I tried tables first off, but cos I wanted scrolling text in only part of the page, this was the best way to go, AND get it to work in NS4, NS6 and IE6 in 800x600 and 1028x768. It still needs some work on NS for the 1028x768, but I think I can get that sorted. Thanks for the idea, tho. 
 
Thank you all for taking the trouble to help. 
 
Hope I can do the same for you sometime! 
 
Maj

Can I import more than two stylesheets for a background

liunx

Guest