Adding DOCTYPE causes CSS weirdness — OZONE Asylum, home of the Mad Scientists

XML - XSL - XSLT - XHTML - CSS - DOM

Adding DOCTYPE causes CSS weirdness

This page's ID: 21967

Edit Post

Who can edit a post?	The poster and administrators may edit a post. The poster can only edit it for a short while after the initial post.

Your User Name:
Your Password:
Login Options:	Remember Me On This Computer

Your Text: Insert Slimies » Insert UBB Code » Close Last Tag \| All Tags UBB Help	MajorFracas, Thanks for the feedback. I've been working extensively on the page today. Let me explain the current state of affairs: I set out on this road to learn how to get rid of tables and use CSS exclusively. As of this posting, I've nearly concluded that there's no point. The table hack I was using before ([url]http://152.19.40.74/ccbc/microarray/vnb/index.cgi[/url]) works on all my test browsers in the same way: Mac using IE, Windows using IE6, and Linux using Mozilla. Everything looked the way I wanted it to, with no overlapping elements or hidden scroll bars or really any problems at all. There was a little extra padding in the nav bar on a Mac using IE, but otherwise it worked in all the browser/os combinations I have available to me. I have tried to use CSS on the recommendations of people here. It has been quite frustrating. No matter what I do, it breaks in one browser or the other. side note: Your last point about inline css being an issue does not apply to this site. All of the pages (except the main page, please ignore it for now) are built from the same header file, which is where the inline css is stored. In effect, I am doing what you suggest. A change one place automatically cascades through all the pages. I first tried to simply place elements using embedded style elements, just to see how they should be structured to work properly. For example, <img src="../images/ccbc_logo.gif" alt="" width="290" height="101" style="position: absolute; top: 0px; right: 0px; border:0px"></img> This approach gave me very straightforward code. No tables, a small handful of elements explicitly placed using CSS positioning. It was unsuccessful for many reasons, such as elements not situating properly in IE. I can't even remember all of the issues. I then read a tutorial about recreating frames with css. The page was basically structured the way I wanted my page, so I adopted that approach. ([url]http://www.fu2k.org/alex/css/frames/fixed[/url]) You'll noticed that the tutorial has its scrollbar hidden by the header, which is why mine is doing so now. Your fix might work if I try it. The problems with this approach have been myriad. First, the corner logo. In Linux/Mozilla, I had everything looking perfect. But in IE, the logo was almost completely off of the page. In addition, the top 100 pixels worth of content was buried under the header. It is as though IE is completely ignoring directives such as top: 101px. The solution was to put a bunch of <br /> tags to move the content down and two corner logos. One is for IE, the other is for Linux. In Linux, the corner logo was scrolling away when I set it to absolute. Which it should. But the same absolute element was hiding offscreen in IE. On the flip side, if I set a corner logo to fixed and gave it a right margin of ~200px, it would show up where I wanted it to in IE but not in the right place in Linux. So I have both. Now, the only weirdness is that one of the copies scrolls in Linux, leaving a stable one behind. I can live with that for now. In addition, IE was ignoring my css. I would embed a style using style="", and it would work. Moving the exact same style elements to the inline style sheet broke it. Finally, I opened it up in Mac using IE, and the background: url() property does not appear to be working. It is a huge mess. So I go back to my table hack, and everything is playing nicely, resizing effortlessly, looking right. Why am I doing CSS again? ~~~~~~~~~~~~~~~~~~~~~~~ Judge Rob, DVD Verdict: http://www.dvdverdict.com/dossiers/rlineberger.php Site I'm currently struggling with: http://pc247h8312.med.unc.edu/ccbc/index.cgi [small](Edited by [internallink=3362]Rob Lineberger[/internallink] on 06-03-2004 19:54)[/small] Loading...
Options:	Enable Slimies Enable Linkwords

« Backwards — Onwards »

Show Forum Drop Down Menu