Solved

Different layout in Internet and Firefox

Posted on 2010-08-22
4
560 Views
Last Modified: 2012-08-14
Hi!

I have a website and the layout is not the same in IE and Firefox.
The result in Firefox is what I want, but in IE it's totally different.

There are 4 DIVs and this is the CSS:

.left1{
   float: left;
   clear: left;
   width: 670px;
   height: auto;
}

.left2{
   float: left;
   clear: left;
   width: 670px;
   height: auto;
   margin-top: 15px;
}

.right{
   float: right;
   clear: right;
   width: 300px;
   height: auto;
}

Open in new window


Layout in FIrefox
Layout in IE
0
Comment
Question by:calypsoworld
[X]
Welcome to Experts Exchange

Add your voice to the tech community where 5M+ people just like you are talking about what matters.

  • Help others & share knowledge
  • Earn cash & points
  • Learn & ask questions
4 Comments
 
LVL 83

Accepted Solution

by:
Dave Baldwin earned 167 total points
ID: 33496085
Make the left divs 660px and see if it works.  You could also give the body a margin of 0.
0
 
LVL 17

Assisted Solution

by:nanharbison
nanharbison earned 167 total points
ID: 33497433
You need to read this article because this is ALWAYS going to be a problem with IE.I create conditional style sheets for IE after I have the pages looking perfect in FF.
http://www.456bereastreet.com/archive/200612/internet_explorer_and_the_css_box_model/
0
 
LVL 13

Assisted Solution

by:myderrick
myderrick earned 166 total points
ID: 33506904
Let me ask. What is the total width of the main container that has these three divs?

One of the reasons IE will behave like above is when the widths of the div is a little wider than the container width. You can try reducing the right divs width or use the simple IE specific width element "_width".

This will be read by only IE.

Please do post back

MD
0
 

Author Closing Comment

by:calypsoworld
ID: 33543623
The inside divs was a little bigger than the container.

Thank you!
0

Featured Post

Industry Leaders: We Want Your Opinion!

We value your feedback.

Take our survey and automatically be enter to win anyone of the following:
Yeti Cooler, Amazon eGift Card, and Movie eGift Card!

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

Suggested Solutions

Have you tried to learn about Unicode, UTF-8, and multibyte text encoding and all the articles are just too "academic" or too technical? This article aims to make the whole topic easy for just about anyone to understand.
Today, the web development industry is booming, and many people consider it to be their vocation. The question you may be asking yourself is – how do I become a web developer?
In this tutorial viewers will learn how to embed an audio file in a webpage using HTML5. Ensure your DOCTYPE declaration is set to HTML5: : The declaration should display (CODE) HTML5 is supported by the most recent versions of all major browsers…
In this tutorial viewers will learn how to style rounded corners for elements in CSS using the border-radius property Begin with a normal styled element such as a div: To style all four corners of the div to be the same degree of roundness, use the …

737 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question