| Home | Register | FAQ | Members List | Search | Today's Posts | Mark Forums Read |
25-05-2005, 02:13
|
#1 (permalink) |
|
rejected CSS offspring!
Join Date: May 2005
Location: Lost somewhere in western europe!
Posts: 29
|
CSS or bust!
Hi guys, thanks for ALL your help so far! I'm new to the css side of things (doing everything in TopStyle and by hand, having worked before in screamweaver, well thats in the bin now, so to speak)....I've checked through the various links people gave me but I'm just going around in circles at this point. I've gone over the CSS to my site again and laid out the flow a bit better (thanks esp to stormFX/emilpaun/pgo/dc dalton/etc) ...but I've gotten to the point where the two browsers (IE/FF) start changing things...if that makes any sense. link Can you guys please tell me what I'm doing wrong/not doing right in the CSS. I had it more or less ok in FF before but IExploder looked like S***. 1. I've put coloured borders around the various divs for easy fixing. the thing I noticed is the "container" (sky blue border) div for the middle section (left, center, right)...actually in IE it works as expected but in FF it doesn't have a height at all (I gave it 20px or something to see it) 2. how can I get the footer "nailed" to the bottom of the browser window? in IE its too short and FF the page is scrolling a little (something I don't want) 3. the right menu has the position/width I want +/-. but how do I make the bottom *stick* to the footer so that no matter what the browser resolution (800x600 and up) the bottom part stretches! this goes for the other side too. 4.the main gallery section... how do I make the sides AND bottom hug the surrounding elements (left, footer, right)...I've been having at this all day and its driving me bonkers! 5.finally, the nav section at the top... how do I make the images line up together side by side? is there a better way? Sorry for all the questions but as I said I'm a noobie to CSS/divs. - Styley Last edited by FreakStyley : 26-05-2005 at 23:59. |
|
|
|
|
25-05-2005, 05:26
|
#2 (permalink) |
|
www.nakedintruder.com
Join Date: Jan 2005
Location: Leeds, Yorkshire
Posts: 383
 |
Slightly irrelevant, but this article is good http://www.macromedia.com/newsletter...rackingid=BIDH |
|
|
|
25-05-2005, 05:41
|
#3 (permalink) |
|
Happy Easter.
Join Date: Feb 2005
Posts: 6,333
|
Your xhtml & css are not valid. tidy up the errors first, then ask again  you can add these links to your pages for quick validation: HTML Validator - http://validator.w3.org/check?uri=referer CSS Validator - http://jigsaw.w3.org/css-validator/check/referer |
|
|
|
25-05-2005, 05:58
|
#5 (permalink) |
|
dt immigrant
Join Date: Nov 2004
Location: Bucharest - Romania
Posts: 7,721
  |
well, your determination is to be admired, but I am going to try to talk you out of it first, what you are trying to do is a very complex layout, and you try to do that using an awful lot of markup. Nested divs, floated divs, absolute divs and if your layout looks cranked in this phase, think about all the debugging you'd have to do when you actually start adding content... why choose a liquid layout? it really fucks up your entire page display, depending on the extent to which the window is resized or not, so you actually end up having a lot more situations to deal with than you'd have with a fixed layout, and not having any control on the way the page is displayed. (check the attached image to see how it looks with the window resized.) If you'd still go for a liquid layout, check out www.stuffandnonsense.co.uk the point of using css-driven layouts is that you get more power over the layout, and you can easily change it, without having to change the actual markup. which is great when you have to deal with a website that has more than 5 pages... I don't think honestly that you can do that as easily with the markup you have now. Check for instance these pages. http://test.randomcolors.com/index.html http://test.randomcolors.com/folio.php that is the exact same content on both pages, only the css is different. a better yet example would be www.csszengarden.com --------------------------------------------------- well, I hope you get my point now to answer some of your questions. You can not have a div aligned to the bottom of the viewport without some javascript (it works fine without it in ff, but ie does not play nice.) sorry I can't give you too much detail, it's something I'm struggling with at the moment too. (maybe you can figure out how it's done by studying the www.rammstein.com code) you could try to fake the background with background images so that it gives the impression of columns http://www.alistapart.com/articles/fauxcolumns/ transparent rounded corners - the clean way use lists for your nav. now I know you have been given this link before, but I insist on you actually reading the stuff there http://css.maxdesign.com.au/ to sum up, keep it simple. it's better that way, peace. Emil Last edited by emil : 25-05-2005 at 06:04. Reason: forgot to attach image |
|
|
|
25-05-2005, 06:13
|
#6 (permalink) | ||
|
dt immigrant
Join Date: Nov 2004
Location: Bucharest - Romania
Posts: 7,721
|
oh, one more thing, if IE does not play nicely for whatever reason, you could give it a different piece of css to chew on that's for normal, reasonable browsers: Quote:
and for IE Quote:
|
||
|
|
 |
