CSS - Install Multiple Versions Of Ie For Testing Purposes...
In case you guys didn't know about this, you can have multiple versions of IE, back to IE3, running simultaneously on your machine (for testing out your web work).
Here's the link: http://tredosoft.com/Multiple_IE I just have IE5 through IE7 installed as there's no way I'm developing for 4 and below. Heck, I pretty much just test in IE6 and up. Hope this helps. Similar TutorialsI run http://www.licklinux.com and the site has been designed to fit most browsers. Such as Gecko (e.g. Firefox), IE, Opera, even Lynx e.t.c. Though in older versions of IE, the sidebar has an awfully ugly blank right-margin. I can't seem to fix this problem, and by viewing my stats 17% use these non-compatible browsers. Can someone please help me? I usually figure CSS problems out myself, but now I'm totally lost... Hello all, just when I thought IE6 and all its quirks was behind us I am faced with a very strange issue that can only be replicated in one version of IE8 that a client has... You'll find attached a layout with header, middle content area that stretches to fill remaining space (and has a background image that uses JQuery bgstretcher to fill its background with an image), and a footer that just stays at the bottom in IE7, IE8 and FF. Problem is, that in a client's PC with Explorer 8 that same footer is not a small stripe but it goes way up into the content area and takes up 1/3 of the screen space at the bottom. I can't replicate this in any of my IE7s or IE8s I looked around and I'm going mad. Is there something in the CSS that I could maybe take out or change or does someone know of any IE8 bug? Thanks. All html + css is here (208K pls remove gaps to get link): www . sendspace . com / file / ool8zx I just finished modifying an open CSS/XHTML webpage and it displays perfectly on IE7. When the page is viewed on other IE versions, it is completely jumbled (i.e. footer at top of page, hover boxes on navigation bar take up whole screen, borders exceed defined 1000px, etc.) I am a novice at CSS and am having difficulty fixing these issues. Any help would be greatly appreciated. I'v attached screen shots of the correct and incorrect layouts. I have 2 css formatting files: setup and text Here's SETUP.CSS: /* NON-HEADER */ *{padding:0; margin:0;} body {font-size:62.5%; background:rgb(250,250,250) url(../img/bg_sides.gif); font-family:Verdana,arial,sans-serif; margin-bottom:40px} /*Font-size: 1.0em = 10px when browser default size is 16px*/ .page-container {width:1000px; margin:0px auto; margin-bottom:25px; font-size:1.0em;} .page-footer {width:1000px; margin:0px auto; margin-top:20px; margin-bottom:10px; font-size:1.0em; text-align:center;} .main {clear:both; width:1000px; padding-bottom:30px; background:rgb(255,255,255); top left repeat-y;} .main-navigation {display:inline /*Fix IE floating margin bug*/; float:left; width:200px; overflow:visible !important /*Firefox*/; overflow:hidden /*IE6*/;} .main-content {display:inline; /*Fix IE floating margin bug*/; float:left; width:940px; margin:30px 0 0 30px; overflow:visible !important /*Firefox*/; overflow:hidden /*IE6*/;} .footer {clear:both; width:1000px; padding:1.0em 0 1.0em 0; background:transparent; font-size:1.0em; overflow:visible !important /*Firefox*/; overflow:hidden /*IE6*/;} /* --- For alternative headers START PASTE here --- */ /* HEADER */ .header {width:1000px; font-family:"TREBUCHET MS",arial,sans-serif;} .header-top {width:1000px; height:100px; background:rgb(195,0,0); overflow:visible !important /*Firefox*/; overflow:hidden /*IE6*/;} .header-middle {width:1000px; height:30px; background:transparent; overflow:visible !important /*Firefox*/; overflow:hidden /*IE6*/;} .header-bottom {width:1000px; height:300px; background:rgb(204,0,0) repeat-y;} .header-breadcrumbs {clear:both; width:1000px; padding:1.0em 0 1.5em 0; background:rgb(255,255,255) url(../img/bg_head_breadcrumbs.jpg) repeat-y;} /*******************/ /* HEADER SECTION */ /*******************/ .sitelogo {width:400px; height:100px; position:absolute; z-index:1; background:url(../img/header-logo.jpg); } .sitepic {width:1000px; height:300px; position:absolute; z-index:1; background:url(../img/header-logo.jpg); }.sitename {width:300px; height:45px; position:absolute; z-index:1; margin:20px 0 0 90px; overflow:visible !important /*Firefox*/; overflow:hidden /*IE6*/;} .sitename h1 {font-size: ;} .sitename h2 {margin:-4px 0 0 0; color:rgb(125,125,125); font-size:120%;} .sitename a {text-decoration:none; color:rgb(125,125,125);} .sitename a:hover {text-decoration:none; color:rgb(50,50,50);} .nav0 {width:350px; position:absolute; z-index:2; margin:25px 0 0 0; margin-left:550px !important /*Non-IE6*/; margin-left:553px /*IE6*/;} .nav0 ul {float:right; padding:0 20px 0 0;} .nav0 li {display:inline; list-style:none;} .nav0 li a {padding:0 0 0 3px;} .nav0 a:hover {text-decoration:none;} .nav0 a img {height:14px; border:none;} .nav1 {width:350px; position:absolute; z-index:3; margin:10px 0 0 650px;} .nav1 ul {float:right; padding:0 15px 0 0; font-weight:bold;} .nav1 li {display:inline; list-style:none;} .nav1 li a {display:block; float:left; padding:2px 5px 2px 5px; color:rgb(255,255,255); text-decoration:none; font-size:100%;} .nav1 a:hover {text-decoration:none; color:rgb(145,145,145);} .sitemessage {width:400px; height:120px; position:absolute; z-index:1; margin:30px 0 0 480px; color:rgb(234,239,247); /*overflow:visible !important /*Activate if Firefox print problems*/; overflow:hidden /*IE6*/;} .sitemessage h1 {width:400px; text-align:right; font-size:230%;} .sitemessage h2 {float:right; width:320px; margin:8px 0 0 0; text-align:right; line-height:100%; font-size:160%;} .sitemessage h3 {float:right; width:320px; margin:10px 0 0 0; text-align:right; font-size:140%;} .sitemessage h3 a {text-decoration:none; color:rgb(234,239,247);} .sitemessage h3 a:hover {text-decoration:none; color:rgb(50,50,50);} /*Drop-down menu*/ .nav2 {float:left; width:1000px; border:none; background:transparent url(../img/nav-bar-main.jpg) no-repeat; color:rgb(255,255,255); font-size:110%;} /*Color navigation bar normal mode*/ .nav2 ul {list-style-type:none;} .nav2 ul li {float:left; position:relative; z-index:auto !important /*Non-IE6*/; z-index:1000 /*IE6*/; } .nav2 ul li a {float:none !important /*Non-IE6*/; float:left /*IE-6*/; display:block; height:30px; line-height:30px; padding:0 16px 0 16px; text-decoration:none; font-weight:bold; color:rgb(255,255,255);} .nav2 ul li ul {display:none; border:none;} /*Non-IE6 hovering*/ .nav2 ul li:hover a {background-color:rgb(210,210,210); border: solid 1px rgb(130,130,130); text-decoration:none; color:rgb(80,80,80);} /*Color main cells hovering mode*/ .nav2 ul li:hover ul {display:block; width:140px; position:absolute; z-index:999;} .nav2 ul li:hover ul li a {display:block; width:140px; height:auto; line-height:1.3em; padding:4px 16px 4px 16px; margin-top:-2px; border-left:solid 1px rgb(130,130,130); border-bottom: solid 1px rgb(130,130,130); background-color:rgb(210,210,210); font-weight:bold; color:rgb(80,80,80);} /*Color subcells normal mode*/ .nav2 ul li:hover ul li a:hover {background-color:rgb(204,0,0); text-decoration:none; color:rgb(255,255,255);} /*Color subcells hovering mode*/ /*IE6 hovering*/ .nav2 table {position:absolute; top:0; left:0; border-collapse:collapse;} .nav2 ul li a:hover {background-color:rgb(210,210,210); text-decoration:none; border: solid 1px rgb(130,130,130); color:rgb(80,80,80);} /*Color main cells hovering mode*/ .nav2 ul li a:hover ul {display:block; width:140px; position:absolute; z-index:999;} .nav2 ul li a:hover ul li a {display:block; width:140px; height:auto; line-height:1.3em; padding:4px 16px 4px 16px; margin-top:-2px; border-left:solid 1px rgb(130,130,130); border-bottom: solid 1px rgb(130,130,130); background-color:rgb(210,210,210); font-weight:bold; color:rgb(80,80,80);} /*Color subcells normal mode*/ .nav2 ul li a:hover ul li a:hover {background-color:rgb(204,0,0); text-decoration:none; color:rgb(255,255,255);} /*Color subcells hovering mode*/ .header-top .searchform {float:right; width:285px; padding:0 17px 0px 0px !important /*Non-IE6*/; padding:0 12px 0px 0px /*IE6*/;} .header-top .searchform form fieldset {float:right; border:none;} .header-top .searchform input.field {width:10.0em; padding:0.2em 0 0.2em 0; font-family:verdana,arial,sans-serif; font-size:120%; } .header-top .searchform input.button {width:3.0em; padding:1px !important /*Non-IE6*/; padding:0 /*IE6*/; background:transparent url(../img/search-button.gif); text-align:center; font-family:verdana,arial,sans-serif; color:rgb(150,150,150); font-size:120%;} .header-top .searchform input.button:hover {cursorointer; background:transparent url(../img/search-button.gif);} /******************/ /* MAIN SECTION */ /******************/ /* MAIN CONTENT */ .column1-unit {width:950px; margin-bottom:10px !important /*Non-IE6*/; margin-bottom:5px /*IE6*/;} .column2-unit-left {float:left; width:600px; margin-bottom:10px !important /*Non-IE6*/; margin-bottom:5px /*IE6*/;} .column2-unit-right {float:right; width:300px; margin-bottom:10px !important /*Non-IE6*/; margin-bottom:5px /*IE6*/;} .column3-unit-left {float:left; width:283px; margin-bottom:10px !important /*Non-IE6*/; margin-bottom:5px /*IE6*/;} .column3-unit-middle {float:left; width:283px; margin-bottom:10px !important /*Non-IE6*/; margin-bottom:5px /*IE6*/; margin-left:50px;} .column3-unit-right {float:right; width:283px; margin-bottom:10px !important /*Non-IE6*/; margin-bottom:5px /*IE6*/;} /********************/ /* FOOTER SECTION */ /********************/ .footer p {line-height:1.3em; text-align:center; color:rgb(125,125,125); font-weight:bold; font-size:110%;} .footer p.credits {font-weight:normal;} .footer a {text-decoration:underline; color:rgb(125,125,125);} .footer a:hover {text-decoration:none; color:rgb(0,0,0);} .footer a:visited {color:rgb(0,0,0);} /******************/ /* CLEAR FLOATS */ /******************/ .page-container:after, .header:after, .header-breadcrumbs:after, .main:after, .main-content:after {content:"."; display:block; height:0; clear:both; visibility:hidden;} .column1-unit:after, .column2-unit-left:after, .column2-unit-right:after, .column3-unit-left:after, .column3-unit-middle:after, .column3-unit-right:after {content:"."; display:block; height:0; clear:both; visibility:hidden;} .footer:after, p:after {content:"."; display:block; height:0; clear:both; visibility:hidden;} .clear-contentunit {clear:both; width:940px; height:0.1em; border:none; background:rgb(210,210,210); color:rgb(210,210,210);} Here's TEXT.CSS: /******************/ /* MAIN SECTION */ /******************/ /* MAIN CONTENT */ .main-content h1.pagetitle {margin:0 0 0.4em 0; padding:0 0 2px 0; border-bottom:solid 7px rgb(225,225,225); font-family:"georgia",arial,sans-serif; color:rgb(100,100,100); font-weight:bold; font-size:220%;} .main-content h1.block {clear:both; margin:1.0em 0 0em 0; padding:2px 0 2px 2px; background:rgb(190,190,190); font-family:"georgia",arial,sans-serif; color:rgb(255,255,255); font-weight:bold; font-size:220%;} .main-content h1 {clear:both; margin:1.0em 0 0.5em 0; font-family:"georgia",arial,sans-serif; color:rgb(80,80,80); font-weight:normal; font-size:210%;} .main-content h2 {clear:both; margin:1.0em 0 0.5em 0; font-family:"Verdana",arial,sans-serif; color:rgb(80,80,80); font-weight:normal; font-size:170%;} .main-content h3 {clear:both; margin:-.5em 0 0.5em 0; font-family:"Verdana",arial,sans-serif; color:rgb(125,125,125); font-weight:normal; font-size:130%;} .main-content h1.side {clear:none;} .main-content h2.side {clear:none;} .main-content h3.side {clear:none;} .main-content h4 {margin:1.5em 0 1.0em 0; color:rgb(80,80,80); font-family:"Verdana",arial,sans-serif; font-weight:normal; font-size:170%;} .main-content h5 {margin:1.5em 0 1.0em 0; color:rgb(80,80,80); font-family:"Verdana",arial,sans-serif; font-size:140%;} .main-content h6 {clear:both; margin:0 0 .25em 0; line-height:1em; font-family:"Verdana",arial,sans-serif; font-weight:normal; font-size:100%;} .main-content p {margin:0 0 1.0em 0; line-height:1.5em; font-size:120%;} .main-content p.center {text-align:center;} .main-content p.right {text-align:right; margin-right: 10px} .main-content p.details {clear:both; margin:-0.25em 0 1.0em 0; line-height:1.0em; font-size:110%;} .main-content blockquote {clear:both; margin:0 30px 0.6em 30px; font-size:90%;} .main-content table {clear:both; width:880px; margin:2.0em 0 0.2em 20px; table-layout: fixed; border-collapse:collapse; empty-cells:show; background-color:rgb(233,232,244);} .main-content table th.top {height:3.5em; padding:0 7px 0 7px; empty-cells:show; background-color:rgb(175,175,175); text-align:left; color:rgb(255,255,255); font-weight:bold; font-size:110%;} .main-content table th {height:3.0em; padding:2px 20px 2px 7px; border-left:solid 2px rgb(255,255,255); border-right:solid 2px rgb(255,255,255); border-top:solid 2px rgb(255,255,255); border-bottom:solid 2px rgb(255,255,255); background-color:rgb(225,225,225); text-align:left; color:rgb(80,80,80); font-weight:bold; font-size:110%;} .main-content table td {height:3.0em; padding:2px 7px 2px 7px; border-left:solid 2px rgb(255,255,255); border-right:solid 2px rgb(255,255,255); border-top:solid 2px rgb(255,255,255); border-bottom:solid 2px rgb(255,255,255); background-color:rgb(225,225,225); text-align:left; font-weight:normal; color:rgb(80,80,80); font-size:110%;} p.caption {clear:both; margin:0.5em 0 2.0em 20px; text-align:left; color:rgb(80,80,80); font-size:110%;} .main-content ul {list-style:none; margin:0.5em 0 1.0em 0;} .main-content ul li {margin:0 0 0.2em 2px; padding:0 0 0 12px; background:url(../img/bg_bullet_full_1.gif) no-repeat 0 0.5em; line-height:1.4em; font-size:120%;} .main-content ol {margin:0.5em 0 1.0em 30px !important /*Non-IE6*/; margin:0.5em 0 1.0em 35px /*IE6*/;} .main-content ol li {list-style-positionutside; margin:0 0 0.2em 0; line-height:1.4em; font-size:120%;} .contactform {width:418px; margin:2.0em 0 0 0; padding:10px 10px 0 10px; border:solid 1px rgb(200,200,200); background-color:rgb(240,240,240);} .contactform fieldset {padding:20px 0 0 0 !important /*Non-IE6*/; padding:0 /*IE6*/; margin:0 0 20px 0; border:solid 1px rgb(220,220,220);} .contactform fieldset legend {margin:0 0 0 5px !important /*Non-IE*/; margin:0 0 20px 5px /*IE6*/; padding:0 2px 0 2px; color:rgb(80,80,80); font-weight:bold; font-size:130%;} .contactform label.left {float:left; width:100px; margin:0 0 0 10px; padding:2px; font-size:110%;} .contactform select.combo {width:175px; padding:2px; border:solid 1px rgb(200,200,200); font-family:verdana,arial,sans-serif; font-size:110%;} .contactform input.field {width:275px; padding:2px; border:solid 1px rgb(200,200,200); font-family:verdana,arial,sans-serif; font-size:110%;} .contactform textarea {width:275px; padding:2px; border:solid 1px rgb(200,200,200); font-family:verdana,arial,sans-serif; font-size:110%;} .contactform input.button {float:right; width:9.0em; margin-right:20px; padding:1px !important /*Non-IE6*/; padding:0 /*IE6*/; background:rgb(230,230,230); border:solid 1px rgb(150,150,150); text-align:center; font-family:verdana,arial,sans-serif; color:rgb(150,150,150); font-size:110%;} .contactform input.button:hover {cursor: pointer; border:solid 1px rgb(80,80,80); background:rgb(220,220,220); color:rgb(80,80,80);} .loginform {width:160px; margin:-10px 20px 0 20px;} .loginform p {clear:both; margin:0; padding:0;} .loginform fieldset {width:160px; border:none;} .loginform label.top {float:left; width:125px; margin:0 0 2px 0; font-size:110%;} .loginform label.right {float:left; width:125px; margin:5px 0 0 0; padding:0 0 0 3px; /*IE6*/; font-size:110%;} .loginform input.field {width:158px; margin:0 0 5px 0; padding:0.1em 0 0.2em 0 !important /*Non-IE6*/; padding:0.2em 0 0.3em 0 /*IE6*/; border:solid 1px rgb(200,200,200); font-family:verdana,arial,sans-serif; font-size:110%;} .loginform input.checkbox {float:left; margin:5px 0 0 0 !important /*Non-IE6*/; margin:2px 0 0 -3px /*IE6*/; border:none;} .loginform input.button {float:left; width:5.0em; margin:10px 0 5px 0; padding:1px; background:rgb(230,230,230); border:solid 1px rgb(150,150,150); text-align:center; font-family:verdana,arial,sans-serif; color:rgb(150,150,150); font-size:110%;} .loginform input.button:hover {cursorointer; border:solid 1px rgb(80,80,80); background:rgb(220,220,220); color:rgb(80,80,80);} /********************/ /* COMMON CLASSES */ /********************/ .main img {clear:both; float:left; margin:3px 10px 7px 0; padding:1px; border:1px solid rgb(150,150,150);} .main img.center {clear:both; float:none; display:block; margin:0 auto; padding:1px; border:1px solid rgb(150,150,150);} .main img.right {clear:both; float:right; margin:3px 0 7px 10px; margin-right:10px; padding:1px; border:1px solid rgb(150,150,150);} .main a {color:rgb(70,122,167); font-weight:bold; text-decoration:none;} .main-content h1 a {color:rgb(70,122,167); font-weight:normal; text-decoration:none;} .main a:hover {color:rgb(42,90,138); text-decoration:underline;} .main a:visited {color:rgb(42,90,138);} .main a img {border:solid 1px rgb(150,150,150);} .main a:hover img {border:solid 1px rgb(220,220,220);} Hi, i want to test my sites against ie 5 but where do i get it? And is it possible to have ie 5 and 6 installed at the same time? Also is there a way to test against Safari for windows users? Is there anyway i can test my website on a mac browser (that being safari) without actually having a mac. i.e. can i simulate it as i find some of my users reporting slight hiccups on the layout and i would prefer to be able to test it thoroughly Hey All: Its that time again- testing my pages in different browsers. I have browser cam for another 7 hours, this is my snapshot of the page I am testing. Ok, this is the first time I am testing my code. Any reason why older browsers are not interpreting my CSS correctly? Maybe something I should know about older browsers. Any feedback is helpful- thanks What do you use for Cross Browser Testing? I just came across BrowserCam ($25 per year) at fundable.org. Do you recommend it? thank you. Dr. Mk. Hello, I am creating a form that includes a few JQuery scripts and TinyMCE Editor: http://www.27lamps.com/Beta/Form/Form.html I am having a few problems with my CSS: 1. Restyling the Select (a) When using IE the Drop Down List is on the right instead of on the bottom; (b) The current item in the list should have a different background color; (Please check the select on the bottom of the page to check these 2 items working fine. In this case I used a different class) 2. Error messages Please, submit the form. After the Name input you will get a error message. How can I make this message to not expand and still have the padding? And also having the text aligned left. One problem I am having with my form is every time I use a list inside my form somethings get "broken". This is because the form is using a list. What should be the best way to counteract the styles of the form list into a child list? Any suggestion to improve my form CSS would be great. Thanks, Miguel I was wondering if anyone knows of downloadable software for cross-browser testing (other than downloading all browsers manually). I know there are several websites that offer these features, but I'd like downloadable software as well. It would be even better if it offered some emulators for mobile device browsers as well.... Anyways, just wondering if anyone knows of anything good other than the online web service ones. This is where I always run into trouble. I don't know if I'm taking from the right approach but this is what I usually do and I always end up getting frustrated and taking it out of those poor IE users and just removing IE fixes completely. I usually tackle completely design a site using Firefox and then apply patches as I get around to it ( a round tuit ), but sometimes, a fix will cause other errors and it just ends up in a domino effect until my IE CSS file is bigger than my Firefox CSS and there are still problems. How should I go about this? Should I go to the ghetto with $100 and go around shooting IE users .... or better yet IE development decision makers....? I found the solution to my IE browser issues. There seems to be a new guide out there with a lot of great comments about it. The last guide I followed had a bunch of people asking for help. Hope this works. Hello to all, I have a problem of compatibility when using Safari (V3). I have a strange interface and i can't identify the problem. When I refresh my page,I don't have the same css !!!! The same interface is testing wit hFirefox and IE and it's ok. Can you help me please. Thank you in advance for your time. I would like to have multiple id and all using hover link for all #test1, #test2, #test3, #test4 a:hover{ color:#0F0; } this doesn't work. NOT sure why?? thanks Hello! I'm gonna try to keep this as simple as I can, I don't know css at all... I have a site where I'm gonna feature trailers in Quicktime and I'm planning on using a script called clearbox to open these trailers. Go to my site and view the trailers to see what clearbox is. Now, to my problem. I'm gonna have 20 trailers per page, but all the trailers are not the same size. If you check out the trailers on my site you can see that the close button for the Pirates 2 trailer is a bit off, as to the National Treasure trailer where the button is where it's supposed to be. That's because the trailers are in different sizes, and the boxes/windows also are in different sizes. To change the position of the close button, I have to edit the clearbox.css file. What I'm getting at is that I must have one clearbox.css file for each trailer/window and that every clearbox.css file needs an id or something so I can call it from within the html/php file. Here's the code for clearbox as I have right now on my site. First up is the code I have within the head section... Code: <link href="piratesofthecaribbean2/css_trailer/clearbox.css" rel="stylesheet" type="text/css" /> <script src="piratesofthecaribbean2/js/clearbox.js" type="text/javascript"></script> <link href="nationaltreasure/css_trailer/clearbox.css" rel="stylesheet" type="text/css" /> <script src="nationaltreasure/js/clearbox.js" type="text/javascript"></script> And here are the links for the "View trailer"-buttons... Code: <a href="piratesofthecaribbean2/trailer.php" rel="clearbox(668,,330,,click)"><img border="0" src="http://www.jbfans.com/images/linkfilms_viewtrailer-normal.jpg" class="domroll http://www.jbfans.com/images/linkfilms_viewtrailer-hover.jpg" width="124" height="27"></a> Code: <a href="nationaltreasure/trailer.php" rel="clearbox(668,,342,,click)"><img border="0" src="http://www.jbfans.com/images/linkfilms_viewtrailer-normal.jpg" class="domroll http://www.jbfans.com/images/linkfilms_viewtrailer-hover.jpg" width="124" height="27"></a> Clearly, this setting doesn't work. What I wanna know is if I can have multiple clearbox.css files with different settings (to suit each trailer/window) and if I can call these clearbox.css files in this link: Code: <a href="nationaltreasure/trailer.php" rel="clearbox(668,,342,,click)"><img border="0" src="http://www.jbfans.com/images/linkfilms_viewtrailer-normal.jpg" class="domroll http://www.jbfans.com/images/linkfilms_viewtrailer-hover.jpg" width="124" height="27"></a> I hope someone understands what I want, I really want this to work! Thanks in advance! Based on CSS, on a static XHTML-written site, can multiple languages be used? And can they be user-switchable? Thanks, Chris this code inherits properly in FF, but not in IE. any workarounds? Code: .red { background:red; } .yellow { background:yellow; } .red.yellow { background:purple; } Code: <table border=1> <tr class="red"><td>red</td></tr> <tr class="yellow"><td>yellow</td></tr> <tr class="red yellow"><td>red yellow</td></tr> </table> Ok. So after some one i don't know on a website i was reading told me i should replace my tables with CSS i decided to listen to them. Now the website's top bar should look like this: http://www.leeksoftware.co.uk And i decided to do each box as a DIV. BUT! I can't get them all in a line. I can get the yellow one to the right of the long one but then i cant get the rest in the line. So far the CSS is: Code: div.logo { height: 70px; width: 618px; background-color: #476cD9; float: left; } div.home { height: 70px; width: 100px; background-color: #E29942; margin-left: 619px; float: left; } div.soft { height: 70px; width: 100px; background-color: #CC3333; margin-left: 719px; } div.tuto { height: 70px; width: 100px; background-color: #006666; margin-left: 819px; } div.cont { height: 70px; width: 100px; background-color: #254D78; margin-left: 919px; } I tired adding float left to all of them but that made them go diagonal. Can any one help? Thanks Matt Is it possible to use CSS to "call" multiple PHP scripts and display them on one page? I want to display several different RSS feeds on a page. I have tried using plain tables, but I get an error: "Cannot redeclare startelement() (previously declared........." I put the script in a table he http://rottweilerconnection.com/test1.php This is the RSS feed (script) without the table: http://rottweilerconnection.com/test11.php And here is the script itself http://rottweilerconnection.com/test11.zip Hi all, I have several CSS files to look after different browsers, but I use javascript to match the IE css with IE browsers, etc. Can you only have one CSS file that looks after ALL browsers? So that if the user doesn't have javascript it's not a problem? I've heard of css hacks and css filters being used but I'm not all that familiar. Ben Hi, I'm trying to use multiple classes: div class="class1 class2". As usual, IE 6 does all but not what you would expect. Please allow me to post a code snippet: Code: <html> <head> <style type="text/css"> .class1 { background-color: red; } .class2 { background-color: green; } .class1.class2 { background-color: yellow; } </style> </head> <body> <div class="class1"> .class1 -- should be red </div> <div class="class1 class2"> .class1.class2 -- should be yellow </div> <div class="class2"> .class2 -- should be green </div> </body> </html> Sadly, the rule for .class1.class2 is also applied to the third div, where it should clearly NOT apply, so it is yellow instead of green. I know that using subclasses "is not safe for IE", as is CSS in general -- but is there a workaround that doesn't force me to abandon the technique? Thank you, answers appreciated! |