Jump to content

Making IE/FF compatable web pages.


Recommended Posts

I have quite the dilemma. Every time I redesign my web site, it seems IE doesn't like it. For the most part I didn't care, seeing as my web site isn't frequented that much, and it's mostly by friends who I have converted to something other than Internet Explorer.

Well, now I might actually have to deal with this problem. EACTE (tech education thing in my county) requested a site be designed for them. I'm all for it, and I already have a design in mind. The problem is, I want to make it look good in Firefox (or any compliant browser) and IE.

I need someone to tell me how to make this page look like this screen (from Firefox).

I have limited knowledge of CSS, and I don't want to have to use pure CSS to fix this (I don't have time to learn it unless I absolutely have to). I'd prefer to know any alternative coding to produce the same result. If CSS is the only way then I'll do that but I'd like to avoid that until after the deadline.

Thanks ahead of time. :)

Link to post
I didn't navigate the other pages, but it looks like the only problem is the Navigation bar...am I correct?

-NC

P.S: The way to fix this probably WILL be CSS, but I haven't looked too much in to the workings of your site ;).

Yah, for the most part. The height attribute of the

tag. I was planning on using it quite a bit in the design I had in mind. The little "Too Cool for IE" thing is also not working correctly, and I was thinking about maybe having a bannar like the in the top right of the EACTE site.

Anywho, could you enlighten me to the CSS fix?

Link to post

Erm... maybe I'm not reading the code carefully enough, but it seems like your TD with the menu part is in the same TR as the TD with your desktop image. The TD height property only goes so far to control the height. The first thing the browser considers is what the size of the biggest TD in the given TR is, and then every TD gets that height. The TD's aren't independent "boxes"--they're like cells in a spreadsheet. Stretch one, you stretch them all. The solution, again, assuming I'm reading your code correctly, would be to nest the entire menu into it's own table.

This isn't so much a "browser incompatibility" as much as Firefox is being weird by rendering it the way you want it to be rendered.

Link to post
Yah, I was thinking of an embeded table, but I figured there had to be a less bloated way considering Opera and Firefox both rendered it right. *goes off to make an embeded table*

Guess what? I did something slick. My old web design teacher would be proud of me. Check the site, then check the code. ;)

Link to post

Meh, I'll never accept that CSS should be used to position everything. Tables are so much easier to read for the basic relative positioning of elements major elements. I absolutely accept the fact that CSS is more suitable for positioning smaller elements, but for what tables are being used for here, I don't see a problem. And it's not like the site has four levels of nested tables.

Link to post
Meh, I'll never accept that CSS should be used to position everything. Tables are so much easier to read for the basic relative positioning of elements major elements. I absolutely accept the fact that CSS is more suitable for positioning smaller elements, but for what tables are being used for here, I don't see a problem. And it's not like the site has four levels of nested tables.

I don't agree. Although tables look nice in a WYSIWYG editor compared to some CSS (Adobe GoLive CS handles my layouts done in CSS positioning and does a nearly 100% job at displaying the layout), CSS makes things easier once you actually look at the code. It also reduces the amount of tags in your code.

Link to post

Regarding CSS-based design, I found the wierdest part was going back to writing really basic HTML.

Things like:

* Using heading tags properly

* Having main navigation in a basic unordered list

* Not having any interface images in the HTML

* Severely reducing the amount of HTML that needs to be written

* Building logical content flow

It feels really odd putting your skills aside and going right back to basics.

You end up with a page that looks great in print, but looks like a giant turd on-screen...

...then you add the CSS, and the magic happens ;)

Link to post

And it truly is magic--some amazing things can be done. Try disabling the CSS on the more advanced web design sites--A List Apart, hicksdesign, MezzoBlue, etc.

It's really pretty neat.

-nC

P.S: My "path" was somewhat weird. I started in FrontPage many years ago, moved to DW, sorta learned some HTML through osmosis, and then I ended up learning HTML and CSS at the same time (in the weirdest fashion...I simply read the "CSS Pocket Book" and "HTML Pocket Book" that O'Reilly puts out. It works for me. ;)

Link to post
  • 5 weeks later...

I use CSS too. But here's what i usually do when designing a website/page. I do my pages using Dreamweaver, so after I'm contented with a page:

1. I open it in Firefox and 100% of the time i don't get errors.

2. I open it in IE next, then errors show up. I fix it again but this time only the minimal parts that caused the IE problem until everything is solved.

Sometimes when i can't fix it anymore i pull my hair and go nuts! To the extent of cancelling my page designing. :D

Link to post
css is definately the only way to go, none of that pre-2000 tables nonsense..

i always write my css aimed at opera and then fix for firefox, and IE.

makes life so much easier (as there are loads of css hacks you can implement to fix rendering bugs in ff/ie).

Yah, I've now transfered to all strict, makes compatability a lot easier. That's about the last thing on my list, still haven't learned that much about CSS for ti to replace tables.

I use CSS too. But here's what i usually do when designing a website/page. I do my pages using Dreamweaver, so after I'm contented with a page:

1. I open it in Firefox and 100% of the time i don't get errors.

2. I open it in IE next, then errors show up. I fix it again but this time only the minimal parts that caused the IE problem until everything is solved.

Sometimes when i can't fix it anymore i pull my hair and go nuts! To the extent of cancelling my page designing. :D

I did that almsot to the Tee, but then I switched to strict and it always ends up looking identical in all browsers.

You should get rid of tables and use div's and css for the layout.

An example my latest site:

The Farewell Reason

First on my lsit when my new hard drive gtets here, old one messed up, having to use the linux backup computer. :(

Did you try CSSVista program? In the Same window, you can see both browsers (IE/FF) css view.

I'll take a look at it.

Link to post

Please sign in to comment

You will be able to leave a comment after signing in



Sign In Now
×
×
  • Create New...