Solved

IE7 min-height and padding.

Posted on 2006-11-05
6
1,879 Views
Last Modified: 2012-08-14
When I set a min-height for the content div, IE7 gets weird and messes up my padding.

http://paroxsitic.50webs.com/css/

0
Comment
Question by:reesespeices072
[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
  • 2
6 Comments
 
LVL 15

Expert Comment

by:Daydreams
ID: 17877332
Hi reesespeices072,

I understand the min-height problem has been fixed in ie7, so your hacks for that should be in a stylesheet with:
<!--[if lte IE 6]>
<link rel="stylesheet" href="IEbugs.css" type="text/css" />
According to the conditional comment this is Internet Explorer lower or equal to IE6
<![endif]-->

If you are using other hacks for IE7 you may want to put them in another stylesheet with a conditional comment for that particular version of IE.

http://www.brucelawson.co.uk/index.php/2005/future-proof-your-css-with-conditional-comments/
0
 

Author Comment

by:reesespeices072
ID: 17878768
It is my understanding that IE7 does fix min-height. Before it did not act how it should, and now it does in IE7. That is not my problem. min-height works how it should, it just messes up my padding as its working.

I already knew about the conditional comments and I had fixed the problem, but I find using a whole new css just for IE is painful and it doesn't seem that professional to me, I'd rather use a hack inside the css I already have.
0
 
LVL 15

Accepted Solution

by:
Daydreams earned 250 total points
ID: 17879077
Please note the conditional comment I suggested is different from the one you have. Yours addresses ALL IE browsers (including IE7), my comment addresses IE6 and below. I have called some other experts to take a look at your question though.
0
 
LVL 29

Assisted Solution

by:rdivilbiss
rdivilbiss earned 250 total points
ID: 17882560
In layout.css, try this instead of the current.

#content {
      margin-left:200px;
      padding: 1px;
      padding-left: 20px;
      padding-right: 20px;
      min-height: 450px;
}
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

CSS3 Custom checkboxes This article shows how to style the checkbox form element using only CSS. Works in: Chrome, FF, Safari, Opera, IE9+ Uses modernizr.js to check for :checked pseudo class, falling back to plain old checkboxes (IE8 and bel…
So you have coded your own WordPress plugin and now you want to allow users to upload images to a folder in the plugin folder rather than the default media location? Follow along and this article will show you how to do just that!
In this tutorial viewers will learn how to position overlapping items using z-index in CSS. They will also learn the restrictions on the z-index property.  Create a new HTML document with an internal stylesheet.: Create a div in CSS and name it Red.…
In this tutorial viewers will learn how to style transparent/translucent elements using alpha transparency in CSS Start with a normal styled element, such as a div.: Define its "background-color" property as "rgba (255, 255, 255, .5): The numbers in…

688 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