CSS - Netscape 7.1 Css Problem
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 Similar TutorialsI've been trying get a template working to transfer my site over to CSS (I've been reading about it and it seems to be the way to go) - have been working on it all weekend and have cracked a 3 column grid that seems to work well. You can see where I've got to he http://www.discographynetwork.com/nav2.php The only small problem I have in ie is a missing pixel to the left of the home button. If you have a suggestion for that I'd be grateful. However, when I looked at it in Mozilla and Netscape the buttons mess up and the tag line doesn't stay in it's div. Can someone point me in the right direction. Thanks. Hi.. I'm having a problem with floating on a CSS stylesheet. For some reason my text keeps apearing way off to the right of where it is supposed to.. It works fine with IE but not with Netscape. Any ideas? You can view the page he www.localalberta.com The CSS: www.localalberta.com/completeStyle.css Thanks Guys.. Hi, i have 2 links with email and website. After visited these two links, both should appear yellow (a:visited). Well, with the IE everything functions marvelously, but with the Netscape only one link (website) functioned, but email does not activate itself yellow after the attendance. Here is the Code: Code: style type="text/css"> <!-- a:link {color: #000000; font-family: Verdana; font-size: 10px; text-decoration:none; } a:visited {color: #ffff00; font-family: Verdana; font-size: 10px; text-decoration:none;} a:hover {color: #ffcc33; font-family: Verdana; font-size: 10px; text-decoration:none;} p { font-family: Verdana; font-size: 12px; color: #ccffff; } body { background-color: #9095af; } .style1 {color: #ccffff; font-family: Verdana; font-size: 11px; } .style2 {color: #ccffff; font-family: Verdana; font-size: 20px; } .style3 {color: #000000; font-family: Verdana; font-size: 12px; } .style4 {color: #000000; font-family: Verdana; font-size: 10px; } --> </style> if($email) { $eintrag= "<tr><td><span class='style3'>$text</span></td></tr>"; $eintrag.="<tr><td><a href='mailto:$email'>$email</a>, <span class='style4'>$datum</span></td></tr>"; $eintrag.="<tr><td><hr></td></tr>\n"; } if($website) { $eintrag= "<tr><td><span class='style3'>$text</span></td></tr>"; $eintrag.="<tr><td><a href='$website'>$website</a>, <span class='style4'>$datum</span></td></tr>"; $eintrag.="<tr><td><hr></td></tr>\n"; } What's the problem here??? Greetings I am having a problem changing the bg colors of my tables in netscape and firefox using CSS... Ive tried everything i know, You can view the pages at RateHQ.com look at it in IE and Netscape Any ideas would be great! Thanks, Derek the site seems to work perfectly in IE. it gets garbled in netscape. i know its something to do with the box conventions and the way the browsers interpret margin/border/padding etc.. heres the link to my site http://ccc.1asphost.com/pacemakerproject/final%20website%20folder/index.htm is there an easy way to resolve this problem.. 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> Hello, I have two errors with the repeat background but i need to use this. How can i get round this? Cheers. I am using a table with 5 rows and 5 columns of data. First i hide <td>'s using style.display="none"; When i use style.display=""; for showing up <td>'s , in IE its working fine, but in Netscape 7.1 (Windows) the columns get collapsed on one another. Can anybody know why this happens ? Is there any other way it can solved. Need help pls. Hi there, I'm back again I'm afriad with another minor problem with my new site design. Have a look at the test version of my website he http://www.eveythingfree.buildtolearn.net/classifieds/ If you are looking at it in Internet Explorer it should look fine, but if you try it in Mozilla Firefox or Netscape it looks badly messed up. The problem is with the 2 boxes near the top of the page, the "latest forum posts" one and the "search box". The whole page (from bellow the navbar) is laid out by the php script that generates most of the content of the site. Thus I am limited in what I can adjust but I can use .css to layout these two boxes. Here is the css that controls the forum and search boxes: Code: .forums { font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 10px; color: #666666; text-decoration: none; border: 1px solid #666666; padding: 5px 10px 10px; background-color: #F9F9F9; position: relative; width: 453px; height: 100px; left: 10px; top: 10px; vertical-align: top; margin-bottom: 10px; float: left; } .searchbox { font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 10px; color: #666666; text-decoration: none; border: 1px solid #666666; background-color: #F9F9F9; width: 230px; height: 100px; left: 20px; vertical-align: top; margin-bottom: 10px; padding-top: 15px; top: 10px; position: relative; } .listings { position: relative; top: 10px; } Now I'm pretty sure that the problem lies with the "float" property in .forums. I seem to recall Mozilla and Netscape don't recognise this in the same way IE does. Is there a way of making the site look the same in other browsers as it does in IE? Without the "float" property I have failed to get it to look right, but there must be some way around this problem. I'd really appreciate any help, as this one thing has been holding me back for ages! Thanks, Robert 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 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; } On our new test site for our colleges online catalog I've been charged with trying to fix an issue we are having with some versions of Netscape on some PC's(not mac) where our CSS printing style isn't working....We can't pin point what causes the problem and some pages have the error and others do not, some pages print fine in 7.1 and not 7.2 or 8.1 (in 7.2/8.1 almost everything longer than one page in depth does not print properly) and its really nerve racking. If anyone has experienced a similar problem or knows of a possible solution I would be eternally in thier debt. The link is http://www.ramapo.edu/test/catalog_06_07/ and the pages that have print problems in netscape are generally longer than a page in depth are mostly major requirements pages like. http://www.ramapo.edu/test/catalog_06_07/academicPrograms/TAS/iss_req_major.html When the problem occurs the printer will usually print a blank page with just the url and date (header/footer) or will print nothing but 1 or 2 blank pages with the url/date and this can be seen in preview (no need to waste paper). Here is what it looks like when it properly prints: http://phobos.ramapo.edu/~chdonnel/properprinting.jpg Here is what it looks like when netscape masacres it: http://phobos.ramapo.edu/~chdonnel/badprinting.jpg Thanks in advance, Chris 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 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> 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 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, 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 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? 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 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... |