473,398 Members | 2,113 Online
Bytes | Software Development & Data Engineering Community
Post Job

Home Posts Topics Members FAQ

Join Bytes to post your question to a community of 473,398 software developers and data experts.

CSS Border only showing in IE6, not FireFox 3, Opera

jkmyoung
2,057 Expert 2GB
I seem to be missing the borders from div.level1 and div.level2 when viewed in FireFox or Opera. Simplified version of the code.
Expand|Select|Wrap|Line Numbers
  1. <?xml version="1.0" encoding="UTF-8"?>
  2. <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
  3. <HTML>
  4.     <head>
  5.         <title>Useful Links</title>
  6.         <style type="text/css">
  7.                     body{background-color: #000000;
  8.                             margin:0px;
  9.                             border:0px;
  10.                             padding:10px;}
  11.                     div.level1 {border: medium double rgb(200,200,200)
  12.                                   margin: 0px;
  13.                                   padding:10px;}
  14.                     h1        {font-size:150%;
  15.                                 color: #0000FF;
  16.                                 margin:0px;
  17.                                 border:0px;
  18.                                 padding:0px;}
  19.                     div.level2 {padding:0px, 10px;
  20.                                   border: medium groove rgb(111,111,111)
  21.                                   margin: 0px;}
  22.                     h2        {font-size:130%;
  23.                                 color: #11EE11;
  24.                                 margin:0px;
  25.                                 border:0px;
  26.                                 padding:0px;}
  27.                     div.link {margin:3px, 10px;}
  28.  
  29.                     a            {font-weight: bold;}
  30.                     a:link     {color: #FFFFFF;}
  31.                     a:visited     {color: #FFFFFF;}
  32.                     a:hover     {color: #0000FF;}
  33.                     a:active     {color: #FF0000;}
  34.                     a.new     {font-size: 60%;}
  35.  
  36.                 </style>
  37.     </head>
  38.     <body>
  39.         <div class="level1">
  40.             <h1>Admin</h1>
  41.             <div class="level2">
  42.                 <h2>Applications</h2>
  43.                 <div class="link"><a href="http://www.google.ca" class="main">Google</a>  <a href="http://www.google.ca" target="_blank" class="new">New Window</a></div>
  44.             </div>
  45.         </div>
  46.     </body>
  47. </HTML>
  48.  
Am I declaring border styles incorrectly? Mostly just copied examples from w3schools.

Versions used:
IE 6.0 sp2
Firefox 3.0.3
Opera 9.5.1
Oct 16 '08 #1
3 4662
I'm no expert but after a quick look I noticed you forgot to add a semicoln after your borders in the declaration.

Expand|Select|Wrap|Line Numbers
  1.  <?xml version="1.0" encoding="UTF-8"?> 
  2. <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> 
  3. <HTML> 
  4.     <head> 
  5.         <title>Useful Links</title> 
  6.         <style type="text/css"> 
  7.                     body{background-color: #000000; 
  8.                             margin:0px; 
  9.                             border:0px; 
  10.                             padding:10px;} 
  11.                     div.level1 {border: medium double rgb(200,200,200);
  12.                                   margin: 0px; 
  13.                                   padding:10px;} 
  14.                     h1        {font-size:150%; 
  15.                                 color: #0000FF; 
  16.                                 margin:0px; 
  17.                                 border:0px; 
  18.                                 padding:0px;} 
  19.                     div.level2 {padding:0px, 10px; 
  20.                                   border: medium groove rgb(111,111,111);
  21.                                   margin: 0px;} 
  22.                     h2        {font-size:130%; 
  23.                                 color: #11EE11; 
  24.                                 margin:0px; 
  25.                                 border:0px; 
  26.                                 padding:0px;} 
  27.                     div.link {margin:3px, 10px;} 
  28.  
  29.                     a            {font-weight: bold;} 
  30.                     a:link     {color: #FFFFFF;} 
  31.                     a:visited     {color: #FFFFFF;} 
  32.                     a:hover     {color: #0000FF;} 
  33.                     a:active     {color: #FF0000;} 
  34.                     a.new     {font-size: 60%;} 
  35.  
  36.                 </style> 
  37.     </head> 
  38.     <body> 
  39.         <div class="level1"> 
  40.             <h1>Admin</h1> 
  41.             <div class="level2"> 
  42.                 <h2>Applications</h2> 
  43.                 <div class="link"><a href="http://www.google.ca" class="main">Google</a>  <a href="http://www.google.ca" target="_blank" class="new">New Window</a></div> 
  44.             </div> 
  45.         </div> 
  46.     </body> 
  47. </HTML> 
  48.  
I added them in and it seems to work in the browsers you mentioned for me.
Oct 16 '08 #2
jkmyoung
2,057 Expert 2GB
Ah,ok thanks. can't believe it was something that stupid. Error didn't show when I validated with w3c. Curse IE6 for rendering invalid pages.
Oct 16 '08 #3
drhowarddrfine
7,435 Expert 4TB
Another problem you will have is that you are using the xml declaration on the first line. It is correct to do this but only modern browsers understand it while IE6 will go into quirks mode and not attempt to perform like a modern browser.

Also, case matters in XHTML. Your closing tag </HTML> will be flagged by the validator. Not that is matters because you aren't serving XHTML anyway and no version of IE handles XHTML either.
Oct 17 '08 #4

Sign in to post your reply or Sign up for a free account.

Similar topics

0
by: Red | last post by:
This is apparently an ie display bug, I can't seem to figure out which ie bug this is. a 3 sided border is created by wrapping the 'inner' box in the 'middle' box and padding the 'middle' box...
1
by: Trent L | last post by:
Hello, I'm having a problem where a style for a <a> tag isn't working in IE: border : 1px solid red; If you use my code below, you'll see what I mean. In IE6 on WinXP, I'm not seeing a red...
1
by: Vegard Beider | last post by:
This works fine in Opera and IE, but in Firefox 1.0 there seems to be a problem. With border-collapse set to collapse, it indents the table 1px to the left. Any ideas how to resolve this without...
24
by: Alexander Mueller | last post by:
Hi, the following div is 38 pixels high in IE and Opera, however 42 pixels in Firefox (apparently it calculates the height exclusively the border width) <div style="background-color: #000000;...
4
by: Andreas König | last post by:
Hello group, this is my first message to a newsgroup so I hope I've done everything right ;-) My problem is that I'd like to have a border via css. This seems to be working on the IE, but not...
3
by: Rhino | last post by:
Yesterday, I reworked the index on my site - http://sfl.london.on.ca - so that they used list markup and I'm quite pleased with them. However, I'm having a problem with one small aspect of the menu...
1
by: jason.m.ho | last post by:
Has anyone run into the problem of firefox 'border-collapse: collapse' rendering a table 1-pixel too far to the left? In IE and Opera it will render fine...Does anyone know if this is a bug? This...
22
by: petermichaux | last post by:
Hi, I would like to display a message to Internet Explorer clients to encorage them to get Firefox. Yes they may like Internet Explorer but it is my site :) http://www.explorerdestroyer.com/...
7
by: =?Utf-8?B?TG91IDYy?= | last post by:
010498007741048 This number pops up in search boxes at intermittent times..I have no idea why it does or how to delete it. Could it be some kind of malware or virus/spyware running in the...
0
by: Charles Arthur | last post by:
How do i turn on java script on a villaon, callus and itel keypad mobile phone
0
by: emmanuelkatto | last post by:
Hi All, I am Emmanuel katto from Uganda. I want to ask what challenges you've faced while migrating a website to cloud. Please let me know. Thanks! Emmanuel
0
BarryA
by: BarryA | last post by:
What are the essential steps and strategies outlined in the Data Structures and Algorithms (DSA) roadmap for aspiring data scientists? How can individuals effectively utilize this roadmap to progress...
1
by: Sonnysonu | last post by:
This is the data of csv file 1 2 3 1 2 3 1 2 3 1 2 3 2 3 2 3 3 the lengths should be different i have to store the data by column-wise with in the specific length. suppose the i have to...
0
by: Hystou | last post by:
Most computers default to English, but sometimes we require a different language, especially when relocating. Forgot to request a specific language before your computer shipped? No problem! You can...
0
jinu1996
by: jinu1996 | last post by:
In today's digital age, having a compelling online presence is paramount for businesses aiming to thrive in a competitive landscape. At the heart of this digital strategy lies an intricately woven...
0
by: Hystou | last post by:
Overview: Windows 11 and 10 have less user interface control over operating system update behaviour than previous versions of Windows. In Windows 11 and 10, there is no way to turn off the Windows...
0
tracyyun
by: tracyyun | last post by:
Dear forum friends, With the development of smart home technology, a variety of wireless communication protocols have appeared on the market, such as Zigbee, Z-Wave, Wi-Fi, Bluetooth, etc. Each...
0
isladogs
by: isladogs | last post by:
The next Access Europe User Group meeting will be on Wednesday 1 May 2024 starting at 18:00 UK time (6PM UTC+1) and finishing by 19:30 (7.30PM). In this session, we are pleased to welcome a new...

By using Bytes.com and it's services, you agree to our Privacy Policy and Terms of Use.

To disable or enable advertisements and analytics tracking please visit the manage ads & tracking page.