Re: [WSG] Correct behaviour of fieldset?
Return Receipt Your Re: [WSG] Correct behaviour of fieldset? document: wasOlya Melnikov/ACT/IMMI/AU received by: at:08/11/2011 01:29:03 PM Important Notice: If you have received this email by mistake, please advise the sender and delete the message and attachments immediately. This email, including attachments, may contain confidential, sensitive, legally privileged and/or copyright information. Any review, retransmission, dissemination or other use of this information by persons or entities other than the intended recipient is prohibited. DIAC respects your privacy and has obligations under the Privacy Act 1988. The official departmental privacy policy can be viewed on the department's website at www.immi.gov.au. See: http://www.immi.gov.au/functional/privacy.htm - *** List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm Help: memberh...@webstandardsgroup.org ***
Re: [WSG] Correct behaviour of fieldset?
Hey Stevio, There could be a range of reasons for the select element issue, so the only answer would be it depends. In your case, the issue MAY be related to font-size. Browsers may render the font-size of the select element slightly differently. This could mean that the em unit applied to the select element may be smaller in some browsers, and therefore the select element will not poke out the side of the form. Here is a quick online example: http://maxdesign.com.au/jobs/example-stevio/ There are three form examples on the page. All three of these forms have been set to 30em wide. The first form example has a select element with no width applied. The second form example has a select element set to 32em. Depending on the font-size of the select element, this may mean it pokes out the side of the form element. The third form example has a select element set to 32em AND set to 100% font-size. So, in all browsers EXCEPT IE6, the select element SHOULD stick out the side of the form in all cases. In other words, this is a consistent and correct behaviour. (Child elements that are wider than the parent element should stick outside the parent and be fully visible, unless some form of overflow has been applied). The only exception is IE6, which will operate differently. IE6 will force the parent to wrap around the child element. In this case, the form element will them become 32em wide in order to accommodate the select element. This is not the correct behaviour, but it is a well known IE6 behaviour :) HTH Russ On 01/11/2011, at 7:11 AM, Stevio wrote: I have noticed that the behaviour of fieldset is inconsistent across browsers. I am working on a form where I have a fieldset with a 1px border. If the form has a fixed width of 30em, but there is a select list within that form with a width greater than 30em, then the form width will not expand but the fieldset width *may* expand depending on which browser is being used. The fieldset width expands in Firefox and Chrome, but not in IE and Opera. What is the correct behaviour? Thanks, Stephen *** List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm Help: memberh...@webstandardsgroup.org *** *** List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm Help: memberh...@webstandardsgroup.org ***
Re: [WSG] Correct behaviour of fieldset?
Thanks Russ for the detailed reply and examples. One thing that I did not make clear in my original email is that the reason why the width of the select list within the form may have a width greater than 30em, is because of the content of the select list (the text). The values listed in the select list will be drawn from a database and therefore the width of the select field is determined by the text within that field. The behaviour I want is that the form will have a set width that would expand if the width of the select fields is wider than the default width of the form. However, I tried applying a width to the select fields using CSS (I had not thought of that) and discovered another browser inconsistency:- - If the width of the text within the select list is greater than the specified width of the select list, then when you click on the list to make it appear, the width of the drop down list will expand to fit the width of the items within the list. - The exception to this is IE (I'm using IE8) which displays the dropdown list at the specified width. - Chrome, Opera and Firefox all expand the width of a select list when it is displayed. This would be a great solution except that IE8 acts differently! Regarding my original question about the expanding fieldset width, basically you are saying IE and Opera have it right? Regarding my bigger issue of having a form that expands as necessary, I have found that using the following styles for the form seems to work: min-width: 35em; display:inline-block; Is this the best solution? Thanks, Stephen - Original Message - From: Russ Weakley r...@maxdesign.com.au To: wsg@webstandardsgroup.org Sent: Tuesday, November 01, 2011 9:05 AM Subject: Re: [WSG] Correct behaviour of fieldset? Hey Stevio, There could be a range of reasons for the select element issue, so the only answer would be it depends. In your case, the issue MAY be related to font-size. Browsers may render the font-size of the select element slightly differently. This could mean that the em unit applied to the select element may be smaller in some browsers, and therefore the select element will not poke out the side of the form. Here is a quick online example: http://maxdesign.com.au/jobs/example-stevio/ There are three form examples on the page. All three of these forms have been set to 30em wide. The first form example has a select element with no width applied. The second form example has a select element set to 32em. Depending on the font-size of the select element, this may mean it pokes out the side of the form element. The third form example has a select element set to 32em AND set to 100% font-size. So, in all browsers EXCEPT IE6, the select element SHOULD stick out the side of the form in all cases. In other words, this is a consistent and correct behaviour. (Child elements that are wider than the parent element should stick outside the parent and be fully visible, unless some form of overflow has been applied). The only exception is IE6, which will operate differently. IE6 will force the parent to wrap around the child element. In this case, the form element will them become 32em wide in order to accommodate the select element. This is not the correct behaviour, but it is a well known IE6 behaviour :) HTH Russ On 01/11/2011, at 7:11 AM, Stevio wrote: I have noticed that the behaviour of fieldset is inconsistent across browsers. I am working on a form where I have a fieldset with a 1px border. If the form has a fixed width of 30em, but there is a select list within that form with a width greater than 30em, then the form width will not expand but the fieldset width *may* expand depending on which browser is being used. The fieldset width expands in Firefox and Chrome, but not in IE and Opera. What is the correct behaviour? Thanks, Stephen *** List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm Help: memberh...@webstandardsgroup.org ***
Re: [WSG] Correct behaviour of fieldset?
On Nov 1, 2011, at 11:02 AM, Stevio wrote: The values listed in the select list will be drawn from a database and therefore the width of the select field is determined by the text within that field. The behaviour I want is that the form will have a set width that would expand if the width of the select fields is wider than the default width of the form. Why have a hard-coded width? If you are pulling the select-field text from a database, then you are probably using php to do it. As such, it is a simple matter to find the maximum length of the all the strings pulled and then set a width of the select fields to work. I suggest setting this value in a variable from within css -- I know css doesn't have variables, but that doesn't stop PHP from declaring one. Here's an example: http://sperling.com/examples/pcss/ This isn't a big problem. Cheers, tedd _ t...@sperling.com http://sperling.com *** List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm Help: memberh...@webstandardsgroup.org ***
Re: [WSG] Correct behaviour of fieldset?
Thanks Todd, what I'm really looking for is a minimum width on the form, that expands as need be. However, just setting a minimum-width on a form does not set the form to that width. The width of a form as a block level element defaults to 100%. The solution that seems to work for the form is the following: min-width: 35em; display:inline-block; I want a default width of 35em just for consistency and just how I want it to look. I do not want it getting smaller than that. Stephen - Original Message - From: Tedd Sperling tedd.sperl...@gmail.com Sent: Tuesday, November 01, 2011 3:23 PM Why have a hard-coded width? If you are pulling the select-field text from a database, then you are probably using php to do it. As such, it is a simple matter to find the maximum length of the all the strings pulled and then set a width of the select fields to work. I suggest setting this value in a variable from within css -- I know css doesn't have variables, but that doesn't stop PHP from declaring one. *** List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm Help: memberh...@webstandardsgroup.org ***
[WSG] Correct behaviour of fieldset?
I have noticed that the behaviour of fieldset is inconsistent across browsers. I am working on a form where I have a fieldset with a 1px border. If the form has a fixed width of 30em, but there is a select list within that form with a width greater than 30em, then the form width will not expand but the fieldset width *may* expand depending on which browser is being used. The fieldset width expands in Firefox and Chrome, but not in IE and Opera. What is the correct behaviour? Thanks, Stephen *** List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm Help: memberh...@webstandardsgroup.org ***
Re: [WSG] Correct behaviour of fieldset?
Give the fieldset the display: inside-block; tag should sort it. Mike Flanagan CCO Telford Computer Doctor http://www.telfordpc.co.uk i...@telfordpc.co.uk mailto:i...@telfordpc.co.uk 0800 058 8914 Telford Computer Doctor accepts no liability for the content of this email, or for the consequences of any actions taken on the basis of the information provided, unless that information is subsequently confirmed in writing. Any views or opinions presented in this email are solely those of the author and do not necessarily represent those of Telford Computer Doctor. WARNING: Computer viruses can be transmitted via email. The recipient should check this email and any attachments for the presence of viruses. Telford Computer Doctor accepts no liability for any damage caused by any virus transmitted by this email. On 31/10/2011 20:11, Stevio wrote: I have noticed that the behaviour of fieldset is inconsistent across browsers. I am working on a form where I have a fieldset with a 1px border. If the form has a fixed width of 30em, but there is a select list within that form with a width greater than 30em, then the form width will not expand but the fieldset width *may* expand depending on which browser is being used. The fieldset width expands in Firefox and Chrome, but not in IE and Opera. What is the correct behaviour? Thanks, Stephen *** List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm Help: memberh...@webstandardsgroup.org *** *** List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm Help: memberh...@webstandardsgroup.org ***
