Website Babble Webmaster Forums  


Go Back   Website Babble Webmaster Forums > Creating a Website > HTML, PHP, CSS, Javascript & Coding/Programming Topics

Your WB Notifications

Reply
 
LinkBack Thread Tools Display Modes
  #1 (permalink)  
Old 01-28-2010, 03:00 AM
Regular Babbler
 
Join Date: Feb 2009
Posts: 41
sudhakararaog has no reputation at Website Babble yet.
Default min-height in ie6

in my layout i need to use min-height and i noticed that ie6 does not support ie6, so for all browsers i have

#contentouter{
float: left;
width: 915px;
min-height: 500px;
height: auto;
}

for ie6

* html #contentouter{
height: 500px;
overflow: visible;
}

by using min-height in all browsers the contentouter div always has a minimum height of 500px and whenever content exceeds 500px the contentouter div grows automatically in all browsers and also in ie6

is this the right way to use min-height in all browsers and in ie6 with the above code i have used

please advice.

thanks
Reply With Quote
  #2 (permalink)  
Old 01-29-2010, 10:43 AM
meloncholy's Avatar
Master Babbler
 
Join Date: May 2009
Posts: 250
meloncholy has an outstanding reputation at WB (over 500 points)meloncholy has an outstanding reputation at WB (over 500 points)meloncholy has an outstanding reputation at WB (over 500 points)meloncholy has an outstanding reputation at WB (over 500 points)meloncholy has an outstanding reputation at WB (over 500 points)meloncholy has an outstanding reputation at WB (over 500 points)
Default

In the past I've pretty much ignored IE6 in this case - if the frame was too short and cut off half of the background picture (or whatever), that's tough basically. Of course it depends on which is more important / more likely for your site: having a frame that's larger than 500px high or one that's shorter. What you've got is fine for the latter, and ignoring IE6 takes care of the former.

Alternatively you can hack it by taking advantage of IE6's expanding box bug.

We introduce an element that takes up 500px vertically, but then move the following element 500px up the screen, effectively hiding it. Modern browsers will render it 0px high, but IE6 expands the surrounding element to enclose it.

HTML Code:
    .outer { background-color: #f00; min-height: 500px; }
    
    .inner { height: 500px; margin-bottom: -500px; }
HTML Code:
<div class="outer">
	<div class="inner"></div>
Put the content you want here.  This can be short (under 500px) or long.
</div>
So we have, with the help of an extra div, proper min-height behaviour from IE6.

Note: I've only tried this in IE8 in IE6 mode as I don't have access to IE6 right now. But it should work.
__________________
Pole Exercise - Pole dancing evolved
Reply With Quote
  #3 (permalink)  
Old 01-29-2010, 11:11 AM
meloncholy's Avatar
Master Babbler
 
Join Date: May 2009
Posts: 250
meloncholy has an outstanding reputation at WB (over 500 points)meloncholy has an outstanding reputation at WB (over 500 points)meloncholy has an outstanding reputation at WB (over 500 points)meloncholy has an outstanding reputation at WB (over 500 points)meloncholy has an outstanding reputation at WB (over 500 points)meloncholy has an outstanding reputation at WB (over 500 points)
Default

Having googled this, there are worse, better and just different ways to do this. I'd probably go with Dustin Diaz's or Stu Nicholls' solutions.
__________________
Pole Exercise - Pole dancing evolved
Reply With Quote
  #4 (permalink)  
Old 01-29-2010, 04:43 PM
Regular Babbler
 
Join Date: Feb 2009
Posts: 41
sudhakararaog has no reputation at Website Babble yet.
Default

thanks for letting me know.
Reply With Quote
Reply

Thread Tools
Display Modes

Posting Rules
You may not post new threads
You may not post replies
You may not post attachments
You may not edit your posts

BB code is On
Smilies are On
[IMG] code is On
HTML code is Off
Trackbacks are On
Pingbacks are On
Refbacks are On




All times are GMT -6. The time now is 12:41 PM.


 Subscribe to RSS

WB Sponsors

flash chat

Home Jobs Online

Search Engine Marketing

Paid Surveys

Web Design Newcastle



 Subscribe to the Website Babble Feeds

2 Create a Website Homepage | 2 Create a Website Blog


Powered by vBulletin® Version 3.8.4
Copyright ©2000 - 2010, Jelsoft Enterprises Ltd.
Search Engine Optimization by vBSEO 3.1.0