Click to See Complete Forum and Search --> : CSS vs Javascript


Vic
08-16-2006, 04:13 PM
I am trying to achieve a page layout that is very difficult in IE using CSS when in a standard-compliant mode (set via !DOCTYPE) and came to a point where I have to make a decision:

A. Use the standard-compliant mode and cater to IE's shortcomings through javascript

or,

B. Use a !DOCTYPE definition that will go into standards-compliant mode with other browsers, but revert to quirks-mode in IE

Any advice on which one may be better?

Charles
08-16-2006, 04:25 PM
C. Adjust your layout or approach the problem from a different direction.

felgall
08-16-2006, 10:22 PM
Definitely go with option C. A lot of IE users have Javascript disabled and it is easier to get IE looking the same as other browsers in standards mode rather than quirks mode.

Kor
08-17-2006, 05:07 AM
Or option D. If correct (according to the Doctype) and crossbrowser HTML, CSS and javascript coded, the page should look the same, nomatter the browser.

Vic
08-17-2006, 06:01 AM
It was my initial objective to achieve "C" (or D for that matter :) ) but after more than a week of hunting for a CSS solution throught web and even this forum, I was not able to find one. (Some of my related posts include:
http://www.webdeveloper.com/forum/showthread.php?t=117123
http://www.webdeveloper.com/forum/showthread.php?t=117256
and even...
http://www.webdeveloper.com/forum/showthread.php?t=117157

As a background, I am doing a web application and need to partition my screen (other than via frames) in a way that makes each area of the screen scrollable within its own <div>. All worked well until I decided to make it crossbrowser compatible and use !DOCTYPE for good measure.

I tried absolute positioning of <divs>, but can't seem to achieve this as I don't know any way in IE to set distance from bottom / right whilst at the same time setting distnace from top / left. Hence my attempt to go back to (ugh) tables to structure my screen, but even then IE does not size row-heights correctly to fit 100% screen when in standards mode.

As a last resort I thought of options A and B, above. Having javascript nabled is a pre-requisite for my application so that would not be an issue, but I share the general view that javascript should NOT be used for layouts. Hence an alternative B.

If anyone could offer practical solution to my dilemma, I'm ready to jumpt on option C any time :)

Kor
08-17-2006, 03:09 PM
iframes?

felgall
08-17-2006, 04:05 PM
Possibly the problem is that you are trying to build your building roof first instead of foundations first.

1. Start with a proper doctype.
2. Add the HTML that semantically defines the content for the page without worrying about how it actually looks.
3. Add the stylesheet commands to get it to look right in standards compliant browsers.
4. If it doesn't look right in IE then add IE conditionals around another stylesheet that provides overrides to the standard stylesheet to tweak things for IE.