Member Avatar for davy_yg

Hi,

http://www.ocklaw.com/new

I wonder why the layout turn into chaos in Firefox, Google Chrome, and Safari?

Can anyone suggest me why and how to fix it ?

Thanks.

  • 4 Contributors
  • 4 Replies
  • 99 Views
  • 1 Day Discussion Span
  • Latest Post Latest Post by teedoff
Member Avatar for hericles

The link didn't work for me. I guess you're saying that it only looks OK in IE. Is the layout that you see in the other browsers similar? Any chance of a screen shot?

Member Avatar for floatingDivs

Set the following CSS to fix the layout issues (especially the footer).

#footer-container { clear: both; }

Then, add the following div underneath <div id="text"> in <div id="boxcontainer">

<div style="clear:both;"></div>

So it should look something like this:

<div id="image"><img align="LEFT" src="http://ocklaw.com/new/wp-content/themes/ocklaw/images/pic2.png"></div>
<div id="text">Request more information from OCK&Associates </div>
<div style="clear:both;"></div>
Member Avatar for davy_yg

ok, if I add this: #footer-container { clear: both; } to the css, the position move to the correct place in Firefox, but the length turns shorter in both browser. The red line suppose to fill the whole browser width, not only as long as the content width.

Member Avatar for teedoff

Before you expect cross browser compliance, and before you try and fix errors like this(works in one browser and not another), you should validate your markup with the validator!

I ran your site through the validator and it showed 65 errors. You can view them here. Many of those errors are serious enough to break your layout, especially in IE. Fix them first, then if you're still having layout issues, post back.

Edit: looking through your source code, you have very poorly coded source code! You dont have a proper page structure.

This is a good basic page structure:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title></title>
</head>
<body>
CONTENT GOES HERE
</body>
</html>

You have list items but they aren't contained in a <ul> or <ol> at all.

Once again, I will suggest that you LEARN some basic coding practices, instead of relying on ppl here to fix every code problem you have.

Edited by teedoff because: n/a
commented: What he's saying is perfectly true, and nuff said about this. +2
Be a part of the DaniWeb community

We're a friendly, industry-focused community of developers, IT pros, digital marketers, and technology enthusiasts meeting, networking, learning, and sharing knowledge.