[WSG] Minimum Height Delimma in IE
Hello All -
Yes the age-old minimum height delimma has come to haunt me.
I usually stay away from anything that cannot be done in IE 6 without a
hack, but I've got a client who loves a design I did before I realized
that the main container would need to be held open vertically under
certain circumstances.
So, now I'm kinda stuck - can anyone help?
#content {
width: 510px;
min-height:500px;
height:auto;
margin: 0 0 0 30px;
color: #000;
padding-bottom: 30px;
position: relative;
z-index: 1;
}
I'm trying out Stu Nicholls solution for ie:
/*\*/
* html #content {
height: 500px;
}
/**/
But, it appears to be LIMITING the height of #content to 500px rather than
letting it expand if there's more than 500px of content.
BTW - the reason I'm using position and a z-index on this element is because
there's a element I that that needs to show behind it. I don't know if that
has any effect on this issue or now.
Any help GREATLY appreciated and I PROMISE not to design anything else that
may cause these IE problems. God, what a headache!
If anyone would like to see the problem live, go here: in FF and then IE 6.
Thanks to all in advance,
Cole
***
List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm
Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm
Help: [EMAIL PROTECTED]
***
[WSG] Out of office reply
Hi, I will be off line the remainder of Friday April 20th. If this is an urgent matter, please contact [EMAIL PROTECTED] Regards, Tony Chester - OnWired, LLC. *** List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm Help: [EMAIL PROTECTED] ***
[WSG] Minimum Height Problem - Link
Sorry, I hit the send button before I included the link. Here it is: http://terashock.terapad.com/index.cfm?fa=contentJobs.positionList So, in FF, the content div opens up fine. In IE using Stu's hack, the dots graphic is there but the content is nailed at 500px. Thanks again to all. Cole *** List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm Help: [EMAIL PROTECTED] ***
Re: [WSG] Minimum Height Delimma in IE
Hi Cole,
Had a look at your page and I think the problem is the overflow:hidden
applied to #container (skin.css line 18). You should see the rest of the
content if you remove that line. If overflow:hidden is absolutely
necessary then you could just remove the height values. IE will expand
the height of the box until it fills the content and FF will just use
min-height. Also the CSS child selector is perfect for overcoming the
lack of min-height support in IE6. Assuming #content is contained within
a DIV tag you could do the following (stripped out unnecessary CSS for
clarity):
#content {
min-height:500px;
height:500px;
}
div#content {
height:auto;
}
IE6 does not support the child selector so it will ignore the second
clause. FF will see min-height and height=auto. The good thing about
this is it's perfectly valid code.
Hope this helps!
Regards,
Ca-Phun
Cole Kuryakin wrote:
Hello All --
Yes the age-old minimum height delimma has come to haunt me.
I usually stay away from anything that cannot be done in IE 6 without
a hack, but I've got a client who loves a design I did before I
realized that the main container would need to be held open
vertically under certain circumstances.
So, now I'm kinda stuck -- can anyone help?
#content {
width: 510px;
min-height:500px;
height:auto;
margin: 0 0 0 30px;
color: #000;
padding-bottom: 30px;
position: relative;
z-index: 1;
}
I'm trying out Stu Nicholls solution for ie:
/*\*/
* html #content {
height: 500px;
}
/**/
But, it appears to be LIMITING the height of #content to 500px rather
than letting it expand if there's more than 500px of content.
BTW -- the reason I'm using position and a z-index on this element is
because there's a element I that that needs to show behind it. I don't
know if that has any effect on this issue or now.
Any help GREATLY appreciated and I PROMISE not to design anything else
that may cause these IE problems. God, what a headache!
If anyone would like to see the problem live, go here: in FF and then
IE 6.
Thanks to all in advance,
Cole
***
List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm
Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm
Help: [EMAIL PROTECTED]
***
***
List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm
Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm
Help: [EMAIL PROTECTED]
***
Re: [WSG] Minimum Height Delimma in IE
I usually stay away from anything that cannot be done in IE 6 without a
hack, but I've got a client who loves a design I did before I realized
that the main container would need to be held open vertically under
certain circumstances.
So, now I'm kinda stuck - can anyone help?
Hi Cole,
You can try this if you want to use overflow and min-height at the same
time:
#zContainer {
overflow:hidden;
min-height:15em;
_height:15em;
_overflow:visible;
_overflow-x:hidden;
}
As a side note, if you want to use min-height using valid declarations in
one single block, you can try:
#zContainer {
min-height:15em;
height:auto !important;
height:15em;
}
HTH,
---
Regards,
Thierry | www.TJKDesign.com
***
List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm
Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm
Help: [EMAIL PROTECTED]
***
[WSG] handling accessible form
I am helping to put together a generic form builder and handler for a bespoke CMS We decided that we would do unobtrusive JavaScript to do client side validation based on class values but also wanted to do server side. My colleague came up with the idea of naming form elements in a certain way so we could determine what server side validation to use e.g. input name='firstname:test:required' etc.. would be a required text input of name firstname. However I think this would not make for a good label for attribute (for accessibility) Two questions : 1. I assume I am right that for attributes on labels get read by screen readers and messing these up would be wrong 2. Any suggestions for a ways of getting, without using AJAX (so it work without javascript) class name into server side or solving this conundrum Thanks Shaun Hare. *** List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm Help: [EMAIL PROTECTED] ***
RE: [WSG] handling accessible form
Your assumption is wrong. Screen readers read the text enclosed by the label element, not their 'for' attribute. I am not aware of any circumstances under which any screen reader reads the 'for' attribute for a label element, so it should be safe to use your colleague's solution. Steve Green Director Test Partners Ltd / First Accessibility www.testpartners.co.uk www.accessibility.co.uk -Original Message- From: [EMAIL PROTECTED] [mailto:[EMAIL PROTECTED] On Behalf Of Shaun Sent: 22 April 2007 01:07 To: wsg@webstandardsgroup.org Subject: [WSG] handling accessible form I am helping to put together a generic form builder and handler for a bespoke CMS We decided that we would do unobtrusive JavaScript to do client side validation based on class values but also wanted to do server side. My colleague came up with the idea of naming form elements in a certain way so we could determine what server side validation to use e.g. input name='firstname:test:required' etc.. would be a required text input of name firstname. However I think this would not make for a good label for attribute (for accessibility) Two questions : 1. I assume I am right that for attributes on labels get read by screen readers and messing these up would be wrong 2. Any suggestions for a ways of getting, without using AJAX (so it work without javascript) class name into server side or solving this conundrum Thanks Shaun Hare. *** List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm Help: [EMAIL PROTECTED] *** *** List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm Help: [EMAIL PROTECTED] ***
