CSS - Css - Site No Longer Working In Unix Environment
Please let me know if i've posted in the wrong forum... and I apologize in advance in case I have.
I've built a site using Apache and PHP. On my local laptop, (which is windows xp professional) everything looks great and my styles are being picked up. When i copy my code over to our unix server, none of the styles are being picked up. I know that Unix is case sensitive but the part thats "failing" is the proper case. I'm not sure what else I can check for.... here's the code: Code: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" > <head> <title>test.ca</title> <meta http-equiv="Content-Type" content="text/html;charset=iso-8859-1" /> </head> <body bgcolor="#FFFFFF" text="#404040" link="#0000FF" vlink="#990099" MARGINWIDTH="1" MARGINHEIGHT="1" TOPMARGIN="1" LEFTMARGIN="1" RIGHTMARGIN="1"> <link type="text/css" href="style/menu.css" rel="stylesheet"> <link type="text/css" href="style/gencontent.css" rel="stylesheet"> And in my gencontent.css, i have the following entry for the BODY tag: Code: body{ list-style: none inside; font-family: verdana, arial, helvetica, sans-serif; background-color: #D2E2F0; } Similar TutorialsHi, I'm pretty new to this so not 100% sure what I'm talking about. I'm trying to complete a university project, in order to do so I have to move images using a style sheet and have done so successfully so far but today when trying to move my rollovers the stylesheet didnt move my images. Previous images I moved worked but the new ones dont. Any help would be greatly appreciated! Thanks! New site under development and a <li> nav menu isn't working in IE7. This has totally flumoxed me and there's a bit on the web about it, but anything I have tried has not worked. three60design.com/sky_site/home.htm Also am trying to reduce the distance from the heading "Services" to the start of the content. Any ideas on both issues??! BTW I have validated XHTML and my CSS and the error remains.... Many thanks in advance Gerry Hello We have a website that is working perfectly fine in IE. But when viewed in firefox...every thing is messed up. I just joined on the project and coming from college environment i think it is essential to get the site workin in firefox. However, i dont have much exp. with css. current i have downloaded EditCSS extension for firefox so that i can views the css and dynamically make changes. The login page when viewed in IE works fine but in firefox...the footer comes inside the header. While looking at the css file and playing around iwth it..i notices that this block of the css is creating problems. Please help? [code] div.container { position : fixed; height : 768px; width : 1024px; margin:0px; padding:0px; font-size: 14; } [\code] When i take this block out...then the footer moves below a little but still not all the way to the bottom of the page. Please help Hi, At my site webpage http://www.pt2fansite.com/demo/monsters.pl there is a list on the middle where after the name of monster the colors changes that table has Code: style="margin-left: 6; padding-top: 2px;" but once i putted it all together it stoped working and is no longer giving the space to it.... What could be possible making it not work ? i have tried to put it into my style.css file and out of it and both ways it does not work. thanks for any help hey all, i have a very wierd problem! Im no CSS guru but i thought i could get this right i have two divs that should both be 100% so i have set them to width:100% BUT....in both Moz FF and IE there is a difference... it is less noticable in IE than in FF but still, not great and kinda wierd!! can anyone adise me please? here is the code Code: #TitleBar { position:absolute; top: 0px; left: 0px; /*margin: 0px 0px 10px 0px;*/ padding: 0px 0px 0px 0px; padding-left:10px; width:100%; /* For IE5/Win's benefit height = [correct height] + [top padding] + [top and bottom border widths] */ height:170px; /* 14px + 17px + 2px = 33px */ border-style:solid; border-color: #A4AA54; border-top: 1px #A4AA54 solid; border-bottom: 1px #A4AA54 solid; border-width:1px 1px; /* top and bottom borders: 1px; left and right borders: 0px */ background-color:#A4AA54; background-image:url(../images/logo/gglogo.JPG); background-position: 1% 2px; background-repeat:no-repeat; z-index:0; /* This is a fix for IE% */ voice-family: "\"}\""; voice-family:inherit; height:170px; width:100%; /* the correct height */ } /* "be nice to Opera 5" */ body>#TitleBar {height:170px; width:100%;} #MenuBar { position:absolute; top: 137px; left:0px; width:100%; padding:15px; background-color:#667138; border-bottom:1px solid #A4AA54; line-height:17px; z-index:1; /* Again, the ugly brilliant hack. */ voice-family: "\"}\""; voice-family:inherit; } /* Again, "be nice to Opera 5". */ body>#MenuBar {width:100%;} thanks in advanced RF My site can be seen he pioneer.nic.edu/~mdmoffet/index.html The CSS is located at pioneer.nic.edu/~mdmoffet/church.css The problem is pretty apparent if you look at the page - the text flows down and beyond the div it is in, and the background/border of the div just randomly stops. I've put height:100% and min-height:100% in all parent elements for it, but that doesn't seem to be working as I expected it to. I'm honestly not sure what to do at this point - if the text is less than the viewport, the div will cover the full length like it is supposed to, it just seems to break at a certain length. Both my html and my css validate. Any ideas? As box1 is filled with content I need box 2 & 3 to stretch to the same height, and so on for box 2 & 3. view page: http://www.franklandmedia.com/test <html> <head> <title>nothin</title> <style type="text/css"> <!-- body { text-align: center; margin: 0px; padding: 0px; min-width:780px; /* stop mozilla sliding off the edge */ } .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; } #top { float: left; width: 780px; background-color: #DDD; } #navbar { float: left; width: 780px; background-color: #EEE; } #middle { float: left; width: 780px; } #footerblock { float: left; width: 780px; background-color: #666; } #box1, #box2, #box3 { float: left; width: 260px; } #box1 { background-color: #AAA; } #box2 { background-color: #BBB; } #box3 { background-color: #CCC; } --> </style> </head> <body><div class="central"> <!--*******page content start*******--> <div id="container"> <div id="top">top</div> <div id="navbar">navbar</div> <div id="middle"> <div id="box1">box1<br>box1<br>box1</div> <div id="box2">box2</div> <div id="box3">box3</div> </div> <div id="footerblock">footer</div> </div> <!--*******page content end*******--> </div></body></html> Has anyone else experienced this? I have a div with a specified width of 503px. If I fill it with text, after about a screens worth it's physically 506px in IE (it's fine in every other browser). Anyone any ideas what could be causing this, or a solution to this problem? Many thanks ok at Rodoslovlje I have an issue. The menu on the left is most of the times longer then the right content part. Is there a way to fix that when this occurs I can make the right part move along without editing every page and hitting enter 20 times? Thnx Here is a new template I am working on for my site (only "Home", "Events" and "People" work, at the moment). It displays as designed in Firefox but it looks absolutely terrible in IE6. I am aware that there are several ways of hacking IE6 to make it behave differently, however I'm not entirely sure of where in particular I should be applying these. Hey all. I have not done a great deal of web development, and whatever I have done has been with tables. I have seen a great many debates on the whole table vs div topic, and so this time thought I'd put together a site with divs + css rather than tables + css. so I have a few questions. here is the very simple code I've got so far. Code: <?php include("header.php"); ?> <div id='container'> <div id='header'> Header </div> <div id='rootmenu'> menu </div> <div id='docbody'> <div id='content'> content </div> <div id='sidemenu'> side </div> </div> </div> <div id='footer'> Footer </div> <?php include("footer.php"); ?> and the css file: Code: html, body { height:100%; } #container { width: 100%; height: 100%; margin: 0 auto 0 auto; margin: 0px auto 0px auto; } #header { height: 10%; width: 70%; background: #000; margin: 0px auto 0px auto; } #rootmenu { width: 70%; background: #fff; margin-bottom: 5px; margin: 0px auto 0px auto; } #docbody { width: 70%; height: 85%; padding: 0px; margin: 0px auto 0px auto; } #content { height: 100%; width: 80%; background: #45f; float: left; } #sidemenu { height: 100%; width: 15%; background: #56f; float: right; } #footer { width: 70%; background: #333; margin: 0 auto 0 auto; } most of this is based on code I've been looking at on sites like oswd.org. I would just like to know that I'm on the right track with my divs and css before putting too much work into the site. it always sucks to realise a serious design flaw at a later time. so please, could I get some suggestions on what I need to change and any important things I should know? cheers. Hi, I am working on moving my tables based site to a tableless css layout. I just wondered if anyone out there could please help, by viewing my site with a Mac, to see if the header image appears. The URL is: http://www.jimpix.co.uk/ecards2/default.asp Another site I made for someone has a header image, defined via the 'background' css property for one of the DIVs, and I have been told it doesn't appear on a Mac. That site is: http://www.somewhereinbetween.biz/ I am concerned my site will suffer from the same problem with a Mac. It looks okay in IE and Firefox. Thanks Jim Upon initial load, you see a red block over the images. Why does it do that and how can I fix it? http://www.kubicle.com/beta/ hello, ive made a site for a client but for some reason when they first see it it moves up and then after they go back its fine. they use an old IE so i cant see why it does on my computer and its fine on mozzilla to. www.designerbagsboutique.co.uk is the website, can anyone help? Hi I need css help to make it a 3 column and add google adsense to my site its a music portal my18friends.com I am currently getting back into creating websites and learning new ways to make them. I like using Photoshop to create the graphics, but is there any way that I can use CSS to make it so that on all my pages the main portion on the site remains the same, such as the header, footer and side bars? Appreciate the help. BTW... the site address is Orpheus Designs . Hey guys. I've been looking for this site that I should have bookmarked when I found but have lost. I can TRY and describe it as best I can. The main background color was white with, depending on the style you've set, a glass of wine or mug of beer fairly large in size and with a low opacity. The styles were simple. Purple or yellow. Wine or beer. Mostly black text. I forget how it was you were able to change them, but he used it in some examples. The menu had list items similar to the naving convention: liquid 2 column nf fixed 3 column nfnh liquid/fixed 3 column etc. The header was the whole wording of whatever the menu items were. Each page he showed examples using css, xhtml and sometimes javascript with the code on the page. At the bottom of each example it had a group for user comments. Some were empty. I don't remember any logos at all on the site other than the wine and beer. I think the url was something like: www.site.com/nameNO~/ I found it the same day I found the "seabold why tables are stupid" site. I remember reading a solution to a problem that I've encountered but I don't remember the code, I was just skimming the site. I tried finding other solutions, or the same solution somewhere else with no luck. Thanks I've been trying to work this for 3 hours now, and I need help!! My problem is that I get cursors on 3 of my links but not the other two. Link to the site is http://borgweb.se/beta <- try the menu css is: Code: body { min-width:1024px; background-color: #f5f3ec; margin-right: 0px; margin-left: 0px; padding: 0px; margin-top: 0px; margin-bottom: 0px; } #header { height:240px; width:100%; background-color: #1e1303; background-image: url(images/topback.png); background-repeat: no-repeat; background-position: 50%; margin-right: auto; margin-left: auto; } #header-logo{ max-width:1024px; position:relative; width:1024px; height:240px; background-image: url(images/bw_logo.png); background-repeat: no-repeat; display: block; margin-right: auto; margin-left: auto; } #menu { background-image: url(images/menu.png); height: 76px; width: 75px; float: right; position: relative; top: 80px; right: 20%; } #home { height: 12px; position: relative; display: block; cursor: pointer; } #home a { background-position: 75px; } #aboutme { height: 12px; position: relative; top: -3px; cursor: pointer; } #portfolio { height: 12px; position: relative; top: -5px; cursor: pointer; } #blog { height: 12px; position: relative; top: -8px; cursor: pointer; } #contact { height: 12px; position: relative; top: -10px; cursor: pointer; } #container { width: 1024px; margin-right: auto; margin-left: auto; display: block; float: left; } html is: Code: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>Untitled Document</title> <link href="style.css" rel="stylesheet" type="text/css" /> </head> <body> <div id="header"> <div id="header-logo"> <div id="menu"> <div id="home" onclick="location.url('#');"></div> <div id="aboutme"></div> <div id="portfolio"></div> <div id="blog"></div> <div id="contact"></div> </div> </div> </div> </body> </html> So I am just getting into designing with CSS, and really enjoying it. I put up this site for a friend, its my first coded by hand. I did it all with BBedit on a mac, and it looks fine on Safari and Firefox. However, as you can see, it looks terrible on IE, totally unusable, and I would accept any advice on how to fix it. The menu came from seco consultants and uses whatever:hover to work in IE, though in this case it dont work. The layout is all screwed up too. Anyone want to offer some advice? Here's the site: dobsonfarm.com/connaught Thanks very much, Robin Turner |