CSS - Css For Xml In Ie8 And Firfox
Hello!
I've got two simple files ... one XML and the formatting CSS: Code: <?xml version="1.0" encoding="UTF-8" ?> <?xml-stylesheet type='text/css' href='test01.css'?> <doc> <p>Some text...</p> <p asdf="note">A note...</p> <safe xml:id='s1'> asdf </safe> </doc> Code: doc {display: block; } p { display: block; } p[asdf="note"]{ color: red; background:black;} safe { display: none; } My problem is, that within IE8 the Information about p[asdf="note"] is ignored. In Firefox everthing is formatted well. As I'm quite new to CSS maybe I'm missing something significant? Any help would be great! thx Similar TutorialsHi folks, I have a website at www.irish-guy.com . Its showed fine with a white background on Explorer and black text when I created in on Windows. I when moved to Mac G4. It was also fine on Safari.....but on Firefox, it had white text and a white background. So I could not read anything. I ahve tried changing the BG Colour to blue (its back white again). When i chaged it to various colors (for example blue) the following happened. (1) Its blue BG and black text on Safari. (2) Its gray BG and black text on Explorer (when viewed on a Mac). (3) Its gray BG and black text on Firefox (except within the picture boxes where its white text). Unreadable. My question is (CSS below), how do i get a white background and black text on all three browsers. Or if you are reading this on Firefox on a Windows machine, how does it read? P.S I am begiining to wonder if the external CSS on my WWW tagboard is overriding the background on my post page! Regards Michael Quote: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" <style type="text/css" media="screen" /> /*----start mash up-----------------------------------------------------------*/ /*----start ruthsarian layout-------------------------------------------------*/ #pageWrapper { margin: 0; width: auto; min-width: 500px; border-color: black; border-style: solid; /* explicitly defined within eact selector in case you want change border styles (to mix it up) between elements */ border-width: 1px; /* puts a border around the whole page */ } body { background-color: gray; color: white; margin: 0; padding: 2em; } body { font-family: arial, helvetica, sans-serif; font-size : x-small; voice-family : "\"}\""; voice-family : inherit; font-size : small; } #masthead { background-color: gray; color: black; border-color: black; border-style: solid; border-width: 0 0 1px 0; padding: 1em; } #masthead h1 { display: inline; /* personal preference to keep the header inline. you could just as easily change padding and margins to 0. */ } #outerColumnContainer { z-index: 1; border-left-color: silver; /* left hand column background color */ border-right-color: blue; /* right hand column background color */ background-color: white; /* this sets the background color on the center column */ color: #111111; border-style: solid; border-width: 0 0 0 200px; /* sets the width of the borders used to create the left and right columns' background color. */ /* border-width: 0 200px; */ /* for three columns */ } #innerColumnContainer { z-index: 2; margin: 0 -1px; width: 100%; border-color: black; border-style: solid; border-width: 0 0 0 1px; /* puts borders between center and the side columns */ /* border-width: 0 1px; */ /* for three columns */ } #contentColumn { margin: 0 -1px; width: 100%; float: left; position: relative; z-index: 10; overflow: visible; /* fix for IE italics bug */ color: black; } #leftColumn { float: left; position: relative; z-index: 10; overflow: visible; /* fix for IE italics bug */ width: 200px; margin: 0 1px 0 -200px; color: black; text-align: center; } #rightColumn { float: left; position: relative; z-index: 10; overflow: visible; /* fix for IE italics bug */ width: 200px; margin: 0 -200px 0 1px; display: none; /* comment this out and edit borders.css to create the third column */ color: black; } #footer { position: relative; background-color: blue; color: white; border-color: black; border-style: solid; border-width: 1px 0 0 0; text-align: center; padding: 1em; } .clear { clear: both; } .hide { display: none; /* hide elements that CSS-targeted browsers shouldn't show */ } .inside { padding: 0.5em 1.5em; /* this padding is applied to every major box within the layout for a uniform gutter between borders */ } html>body #innerColumnContainer { border-bottom: 1px solid transparent; /* help mozilla render borders and colors. try removing this line and see what happens */ } /*----start vertical nav------------------------------------------------------*/ .vnav { margin: 1em 0; } .vnav ul { margin: 0; padding: 0; list-style-type: none; display: block; border: solid 1px black; border-bottom-width: 0; } .vnav ul li { margin: 0; padding: 0; list-style-type: none; display: block; border-bottom: solid 1px black; } .vnav ul li a { display: block; text-decoration: none; padding: 2px 10px; color: black; background-color: white; } .vnav ul li a:hover { background-color: black; color: white; } .vnav h3 { margin-bottom: 0; padding-bottom: 0; } * html .vnav { position: relative; /* IE needs this to fix a rendering problem */ } * html .vnav ul li a {/* hide from IE5.0/Win & IE5/Mac */ height: 1%; } #rightColumn .vnav ul li a { color: black; background-color: white; } #rightColumn .vnav ul li a:hover { background-color: black; color: white; } /*--------------------------------------------------------end vertical nav----*/ /*----start horizontal nav bar------------------------------------------------*/ .hnav { white-space: nowrap; margin: 0; color: black; padding: 3px 0 4px 0; background-color: blue; color: black; border-color: black; border-style: solid; border-width: 0 0 1px 0; } .hnav ul { text-align: center; list-style-type: none; line-height: normal; margin: 0; padding: 0; } .hnav ul li { display: inline; white-space: nowrap; margin: 0; } .hnav ul li a { text-decoration: none; color: black; background-color: yellow; margin: 0 -1px 0 0; padding: 3px 10px 4px 10px; border-left: solid 1px black; border-right: solid 1px black; } .hnav ul li a:hover { text-decoration: underline; background-color: black; color: yellow; } * html .hnav {/* Hide from IE5/Mac (& IE5.0/Win) */ height: 1%; /* holly hack to fix a render bug in IE6/Win */ } } /*--------------------------------------------------end horizontal nav bar----*/ /*----start screen.css---------------------------------------------------------- @import "base.css"; @import "hnav.css"; @import "vnav.css"; @import "colors.css"; @import "gutters.css"; @import "borders.css"; @import "fonts.css"; ------------------------------------------------------------end screen.css----*/ /*---------------------------------------------------end ruthsarian layout----*/ /*----start minima template---------------------------------------------------*/ a:link { color: blue; text-decoration:underline; } a:visited { color: purple; text-decoration:underline; } a:hover { color: red; text-decoration:underline; } a img { border-width:0; } /*----Header------------------------------------------------------------------*/ #masthead h1 a { color: black; text-decoration:none; } #masthead h1 a:hover { color: silver; } #description { display:inline; font:78%/1.4em "Trebuchet MS",Trebuchet,Arial,Verdana, Sans-serif; text-transform:uppercase; letter-spacing:.2em; color: silver; text-align: right; } /* Headings----------------------------------------------- */ h2 { margin:1.5em 0 .75em; font:78%/1.4em "Trebuchet MS",Trebuchet,Arial,Verdana, Sans-serif; text-transform:uppercase; letter-spacing:.2em; color: black; } /* Posts----------------------------------------------- */ .date-header { margin:1.5em 0 .5em; } .post { margin:.5em 0 1.5em; border-bottom:1px solid black; padding-bottom:1.5em; } .post-title { margin:.25em 0 0; padding:0 0 4px; font-size:140%; font-weight:normal; line-height:1.4em; color: red; } .post-title a { display:block; text-decoration:none; color: lightgrey; font-weight:normal; } .post-title a:visited { display:block; text-decoration: underline; color: green; font-weight:normal; } .post-title strong { display:block; text-decoration:none; color: yellow; font-weight:normal; } .post-title a:hover { color: silver; } .post p { margin:0 0 .75em; line-height:1.6em; } p.post-footer { margin:-.25em 0 0; color: silver; } .post-footer em { font:78%/1.4em "Trebuchet MS",Trebuchet,Arial,Verdana, Sans-serif; text-transform:uppercase; letter-spacing:.1em; font-style:normal; color: darkgray; margin-right:.6em; } .comment-link { font:78%/1.4em "Trebuchet MS",Trebuchet,Arial,Verdana, Sans-serif; text-transform:uppercase; letter-spacing:.1em; margin-left:.6em; } .img { padding:5px; background:gold; border:1px solid black; } .post blockquote { border: 1px dashed black; background:gold; font-size: 10px; color:#666; font-family:verdana, arial, sans-serif; padding:8px; } .post blockquote p { margin:.75em 0; } /*----start Sidebar Content---------------------------------------------------*/ #sidebar ul { margin:0 0 1.5em; padding:0 0 1.5em; border-bottom:1px solid black; list-style:none; } #sidebar li { margin:0; padding:0 0 .25em 15px; text-indent:-15px; line-height:1.5em; } #sidebar p { color: darkgray; line-height:1.5em; } /*----start Profile-----------------------------------------------------------*/ #profile-container { margin:0 0 1.5em; border-bottom:1px solid black; padding-bottom:1.5em; } .profile-datablock { margin:.5em 0 .5em; } .profile-img { display:inline; } .profile-img img { float:left; padding:4px; border:1px solid black; margin:0 8px 3px 0; } .profile-data { margin:0; font:bold 78%/1.6em "Trebuchet MS",Trebuchet,Arial,Verdana, Sans-serif; text-transform:uppercase; letter-spacing:.1em; } .profile-data strong { display:none; } .profile-textblock { margin:0 0 .5em; } .profile-link { margin:0; font:78%/1.4em "Trebuchet MS",Trebuchet,Arial,Verdana, Sans-serif; text-transform:uppercase; letter-spacing:.1em; } Hello. I am using a percentage bar javascript code on my website, the problem is, The script works fine in FireFox without adding: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> But only works in IE if I add that code. The problem is, when I do add that code some of my tables go twice the size in height. What is the problem here? Is this going to be easy to fix? What can I do? Thanks a lot, Ben |