Web page won't come out right when i view it. (Web Designing)?

Question

Ok i am a newbie to web design, heres the problem i came across.

The website is http://www.f3kusa.com/

When i go view it with Firefox, everything is fine.
When i view it with Internet Explorer, everything is out of place. Is there something wrong with my code? or it has something to do with my server? i think they are using Red Hat Linux 7.

I am using Dreamweaver 8 as my web creator. I hope i gave all the information i need to help me solve this problem.

Answer 1

Hi I'm the owner of web design company, I've been building sites for years and I can say from experience that browsers and their differences is one of the most annoying parts of being a designer. It adds a lot of extra work to fully test a site to make sure it works, and with the modern use of CMS systems and shopping carts, customer's adding content to the site can break things too and then they blame the designer not realizing they broke the page with the HTML code the accidently injected into the page.

Yes, "browser wars" is a good way to put it ahhaaa. Browser's different interpretation of HTML code is the bane of all HTML design. It drives designers nuts dealing with the different browser issues.

A good place to start is first make sure your code is valid, you can test your code at http://validator.w3.org/
Making sure your code is valid is important in more then just making is more cross browser compliant, it helps with the search rankings and spiders reading the page, and it future proofs your site more then not having valid code.

You should also search in Google etc. and look up and see if the problem you're having is specific to the browser you're using. If it is there's a good chance someone else had the same problem and made a CSS etc. hack to work around it.

A nice service to use to check your site in different browsers is browser cam. I used that in the past and it will help you see your site in many different browsers.

Just stick to it and keep trying different things and you'll slowly but surely pick up on how the different browsers act with the same code. There's no short cuts it just takes a lot of experience to get good at doing HTML well.

Answer 2

Welcome to the Browser Wars. This is a common and normal internet design issue. IE does not handle CSS the same as does Firefox nor as does Opera SO to get it correct you have to add extra code for IE and sometimes opera all depends on what is out of place where.

There are no quick fixes unless you simply dont use those little items that are not IE compatible.. however with Dreamweaver you just don't see them as you design the site. It is always best to design using both IE and Firefox and then for safety add a quick Opera check.

In most cases you need to set some widths within the CSS for it to work correctly in IE and in some cases include other little alignment statements as well as display settings etc. You just need a little "tweeking" to get it to show correctly in all browsers. You should be able to see the exact same results locally on your machine it isn't a server issue at all.

If you go to http://alistapart.com or search for IE CSS Hacks you will find the fixes needed.