|
CSS - Background Only In Netscape Using Css
Hi,
I was curious to know why only the background shows up in Netscape. In IE this site works good. I had it working on Netscape before but now it doesnt. Thanks Similar TutorialsHello, I have two errors with the repeat background but i need to use this. How can i get round this? Cheers. Have exhausted my knowledge base and hoping someone ou there can help. Trying to get Box1 to either autostretch to same the length as box2 & 3 or get the container background to show up in Mozilla & Netscape. Code: <head>
<style type="text/css">
<!--
body {
text-align: center;
margin: 0px;
padding: 0px;
background: #333;
}
.central {
margin-right: auto;
margin-left: auto;
position: relative;
width: 780px;
text-align: left;
}
#container {
float: none;
margin: 0 auto;
width: 780px;
text-align: left;
background: #AAA;
}
#top, #navbar, #middle, #footerblock {
float: left;
width: 780px;
}
#top {
background-color: #DDD;
height: 75px;
}
#navbar {
background-color: #EEE;
height: 25px;
}
#footerblock {
background-color: #666;
height: 25px;
}
#box1 {
background-color: #AAA;
float: left;
width: 260px;
height: 200px;
}
#box2 {
background-color: #BBB;
float: left;
width: 260px;
height: 400px;
}
#box3 {
background-color: #CCC;
float: left;
width: 260px;
height: 400px;
}
-->
</style>
</head>
<body>
<div class="central">
<div id="container">
<div id="top">top</div>
<div id="navbar">navbar</div>
<div id="middle">
<div id="box1">box1</div>
<div id="box2">box2</div>
<div id="box3">box3</div>
</div>
<div id="footerblock">footer</div>
</div>
</div>
</body></html>
Here is the site I am working on: http://testlableon.ourcampusbookstore.com/index.php There are 3 navigation bars on the template. The first one (navbar) is the black one right under the header. The second one (userbar) is right under the navbar and it is supposed to be light gray (#eeeeee). The third one is the at the bottom of the page (footerbar) and is supposed to have a black (#000000) background. If you look at the site in ie, all the background colors are displayed correctly. If you look at the site in firefox or netscape though, the userbar and footerbar are not having their background colors displayed. Any ideas? CSS 1, Netscape 4.x and background+width issue need workaround: I am working on a website template and converting it to CSS. I have seperated my CSS1 from my CSS 2 sheet and am currently trying to get NN 4.x to do what I have read it won't do and have no idea how to make it do what I want. BTW:Please do not advise me to drop NN 4.x, unfortunately it is not within my power to do so. What I need to do is put a background color on an H1 header that will be only as wide as the table cell (column) it is in. (3 column plus header and footer layout). BTW: I cannot drop the table either. My problem is that when I get the background to work (instead of just surrounding the text) I cannot get it to be liquid and remain inside its cell. When I set the width to %'s it just pushes the other 2 columns out of the way even when the % is not the width of the column. Unfortunately, pixels are not flexible enough for this layout. So, how do I get a background color on an H1 tag that fully expands to the width of the column (not just the text) using CSS 1 and NN 4.x while not destroying the table layout? Thank you for your help- Schach PS: This is not an issue of my code, but an issue of the NN 4.x CSS support. So I do not need to have the code debugged, but instead I need a hack or method to outsmart the browser, so I can duplicate a site in CSS. This site is currently heavily reliant on tables, something we want to change, but can't unless we can reproduce the site in NN 4.x. (You can email me if you would like to do that) The CSS background-position: right; is not working in Firefox/Netscape, and just aligns the background image to the left. Know why? i'm new at CSS, and the width works fine in IE but not in Netscape. I'm trying to get #bottomLeftFirst1 to be the same width as #bottomLeft, but for some reason #bottomLeftFirst1 is wider in Netscape. Thanks! #bottomLeft { position: absolute; width: 175px; height: 100%; padding: 0; margin: 0; } #bottomLeftFirst1 { border-width: 1.5px; border-style: none none none none; width: 175px; margin: 0; padding: 5px 0 5px 10px; } I have made some pages with css styling. This works perfect with IE, but he just ignores the css styling in netscape. An example, I made an tumbnail from a picture, set the size in css, works perfect in IE, but he ignores it in netscape. See example http://www.bvkb.be/BVKB/Sportklimme...finale/test.php Can anywhone help me how this comes. On another page he takes some of the css, en some not. Thanks Hi, I'm trying to set a box to be offset over a table that contains a jpg. My code is: Code:
.holder {
position: relative;
}
.offset {
position: absolute;
top: 60px;
left: 50px;
height: 140px;
width: 203px;
padding: 8px;
background-color: #FE9900;
color: #003366;
font-family: Verdana, Geneva, Arial, Helvetica, sans-serif;
font-size: 9px;
}
<div class="holder">
<table align="center" width="100%" cellspacing="0" cellpadding="0" border="0">
<tr>
<td><img src="images/homepage_flyerdeals_pic.jpg" alt="" width="71" height="71" border="0"></td>
<td><img src="images/homepage_flyerdeals_header.gif" alt="" width="127" height="31" border="0"></td>
</tr>
</table>
<div class="offset">
text here </div>
</div>
My problem is, the offset box is too high and wide in Netscape. It looks fine and lines up perfectly in IE. How can I get it to look the same in Netscape?? Hi, This is the first day i am tackling css. Please Explain why my site is looking different in netscape as opposed to IE, (ie is the correct look). This is the link http://www.eac.net.au/remax/template1/new_apartment.htm . I am also attaching my css file, let me know if i am on the right track for using CSS THANKYOU uno_turko I'm sure there is a simple solution, but I'm drawing a blank. I'm trying to line up absolute divs but running into an issue where IE includes the border in the width and Netscape appears to tack the borders on - so if I have a div with a width of 100px and a border of 5px, IE diplays 100px, inclusive of the border. Netscape appears to dispay a div with a total width of 110px. <div align="center" class="box" style="top:49px; left:111px; width:100px; height:100px"><br>Test<br></div> .box {position:absolute; border: 5px double black; font: 200 9px arial} Havn't been able to find the property that may control this. ???? I discovered something today, that NS defines the root containing block as being html whereas IE uses body. That being said, look at this code in both browsers and tell me how you would position the black box so it is in the same location on both browsers - Here is the code: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" lang="en" xml:lang="en"> <head> <meta name="GENERATOR" content="Microsoft FrontPage 5.0" /> <meta name="ProgId" content="FrontPage.Editor.Document" /> <meta http-equiv="Content-Type" content="text/html; charset=windows-1252" /> <title>Navigation</title> <style type="text/css" media="screen"> html{ height:100%; } body { margin: 0; padding: 0; font: 85% arial, hevetica, sans-serif; text-align: center; color: #000; background-color: #00f; height: 100%; border: 0px solid red; } #container { margin: 0px auto; width: 770px; height: 100%; bottom: 0px; text-align: center; background-color: #f00; background-image: url('images/keybg.jpg'); background-repeat: no-repeat; border: 0px solid red; layer-background-color:red; } #mainnav { float: left; width:130px; height:100%; vertical-align: middle; position: relative; layer-background-colorurple; background-colorurple; } #mainbod { float: left; width:640px; height:100%; vertical-align: middle; position: relative; layer-background-color:aqua; background-color:aqua; top:0px; } #banner { float: left; width:640px; height:100px; vertical-align: middle; position: relative; layer-background-color:green; background-color:green; top:0px; } #test{ position:absolute; layer-background-color:black; background-color:black; width:150px; height:30px; top:85px; right:0px; border:1px solid red; } </style> </head> <body> <div id="container" > <div id="mainnav"> hello </div> <div id="mainbod"> <div id="banner"> <div id="test"> </div> </div> hello </div> </div> </body> </html> is there anything special i need to do to get CSS to work with IE? Here is what i have above the </head> tag Code: <link rel="stylesheet" type="text/css" href="layout.css"> the layout.css has: Code:
catheader {
color:#ffffff;
font-size: 14px;
font-weight: bold;
font-family: verdana;
}
then in the <body> i have Code: <catheader>My New Category</catheader> In netscape it shows correctly, in IE it doesnt read it at all. any ideas? Ok so ive got me site looking great on IE, Mozilla, Firefox but still have a problem with Netscape! It's only a small problem but if anyone can help me solve it I would be greatful! http://www.magickev.co.uk In IE, Firefox, Mozilla the main logo is right at the top of the screen and the text box is at the top of the grey area. In netscape there is about a 10 pixel gap, does anyone know how I can get rid of this gap? I have tried everything but to no avail! http://www.freewebs.com/magickev/index.htm - HTML source http://www.freewebs.com/magickev/styles.css - CSS source Thanks, Kev Could someone please tell me why this is not working in Netscape PLEASE... Code:
<html>
<head>
<style type="text/css">
#welcome { float: left; width: 492px; height: 65px; background-image: url(http://impactinvesting.loadedtechnologies.com/Portals/www.impactinvesting.com/skins/impact-investing/images/welcome-back.gif); background-repeat: no-repeat; background-position: left top; background-attachment: scroll; }
.homeWelcome { width: 100%; }
.welcomeHeader { padding-top: 30px; padding-left: 35px; font-family: Arial, Verdana, Helvetica, sans-serif; font-size: 18px; color: #4F91CD; width: 492px; height: 65px; }
</style>
</head>
<body>
<div id="welcome"><span id="dnn_ctr977_dnnTITLE_lblTitle" class="welcomeHeader">Welcome</span></div>
</body>
</html>
Thanks Hello, I am having problems sorting out my css. It all looks good but when i look at the css it has 21 browser errors in different browsers. Mainly it is padding errors for netscape 4.0. Is there a way round this please? Cheers Greetings Yall, I am having a big problem, I am woeking on a site for a huge client and in netscape approx. 50px is cut off the top of the page and my tables sized to 100% cut off approx. 50px from the bottom. I have no idea why or if it is evan a CSS problem at all.... Can anyone give some insight. here is a link: http://www.slbdrivingcentre.ca/dev/ Hello all, When trying to position:absolute an object within another relatively positioned and left floated in netscape 7.1, for some reason the contained element ignores the parents position:relative property and goes to the top left edge of the body. Try www.signplanning.com in Netscape 7.1 and you will see that compared to I.E. the left-side is pushed up and it should look like the Internet Explorer. Thanks in advanced. BAF Hello all, Wondering if those of you who love netscape more than I do can help me, This is a little css script to get a bg image to show in the top right hand corner of a table the table Its called from <td class="rightnav"> Is there something that I i have done that makes netscape not display the image? I'm resonably new to Css, but I have a pretty good handle on it, just not with what netscape supports. Does it have to be called in a <p> tag? I have tried this and a <Div> tag but it wont display, but in Explorer it is fine ... I'd apreciate any suggestions its really frustrating .rightnav { font-family: Arial, Helvetica, sans-serif; font-size: 10px; font-weight: bold; background-image: url(images/continued.jpg); background-repeat: no-repeat; background-attachment: fixed; background-position: top right; height: 100%; white-space: normal; display: block; overflow: hidden; } any help apreciated =) - Shell. When I use padding in a box it increases the width of the box by the amount of the padding when viewed in NS. IE won't. Anybody know of a good solution to this problem? Code:
<html>
<head>
<style type="text/css">
.box1{
position: absolute;
top: 20px;
left: 40px;
width: 50px;
height: 30px;
border-width: 1px;
border-style: solid;
}
.box2{
position: absolute;
top: 55px;
left: 40px;
width: 50px;
height:30px;
border-width: 1px;
border-style: solid;
padding-left: 10px;
}
</style>
</head>
<body>
<div class = 'box1'>
box 1
</div>
<div class = 'box2'>
box 2
</div>
</body>
</html>
Thanks hi, i have used nested divs and with overflow: scrolll and it works perfectly fine in IE but it has no effect in Netscape. how do i achieve the same in netscape without using iframes? thanks in advance... |
|||||||