Summary: | Form elements on Hotwire.com Hot Fare Alert email render incorrectly | ||||||||||||
---|---|---|---|---|---|---|---|---|---|---|---|---|---|
Product: | WebKit | Reporter: | David Kilzer (:ddkilzer) <ddkilzer> | ||||||||||
Component: | Evangelism | Assignee: | Nobody <webkit-unassigned> | ||||||||||
Status: | RESOLVED CONFIGURATION CHANGED | ||||||||||||
Severity: | Normal | CC: | jensimmons, vicki | ||||||||||
Priority: | P2 | Keywords: | HasReduction | ||||||||||
Version: | 523.x (Safari 3) | ||||||||||||
Hardware: | Mac | ||||||||||||
OS: | OS X 10.4 | ||||||||||||
Attachments: |
|
Description
David Kilzer (:ddkilzer)
2007-05-07 07:36:07 PDT
*MORE NOTES - This bug may need to be split to handle the input text field and the pop-up menus separately. - For the input text field, although the size attribute is set to 22, both Opera 9.10 and Firefox 2.0.0.3 shorten it to 20 characters to make it fit within the bounds of the "Find bargain rooms" area. Created attachment 14393 [details]
Test case (mbox format)
This is the mail message as sent by Hotwire.com (more or less).
Interestingly, the input text field renders fine within Mail 2.1 (752/752.2)! The pop-up menus are still too narrow, though.
To import into Mail:
1. Save attachment to desktop.
2. Launch Mail.
3. Select "Import Mailboxes..." from the "File" menu.
4. Select the "Other" radio box.
5. Click "Continue" button.
6. Navigate to the Desktop folder.
7. Click "Choose" button.
8. Make sure only bug-13610-text.mbox is checked.
9. Click "Continue" button.
10. Mail message should now be in an "Imported" folder in Mail.
Created attachment 14394 [details]
Test case (raw HTML from message)
This is the "raw" HTML from the message itself.
Note that the input text field is fine. Looks like Yahoo! Mail is affecting it via stylesheet.
The pop-up menus are still too narrow.
Created attachment 14395 [details]
Test case (web page, complete; zipped)
Hotwire.com mail message inside Yahoo! Mail, saved from Firefox 2.0.0.3 as "web page, complete" format.
Note that input text field renders too wide. Pop-up menus are still too narrow.
Also note that the background of the input text field has turned yellow (even in Safari). This must be a side-effect of viewing/saving the message from Firefox.
Created attachment 17450 [details]
Reduced test case
The issue here is that the "startMonth" <select> element has a style of "width: 51px;" and the "startDay" <select> element has a style of "width: 40px;", both of which are too narrow for WebKit.
This is an evangelism issue since Hotwire.com needs to change the width of the <select> elements (or the font size) for them to render correctly with WebKit.
(In reply to comment #5) > Created an attachment (id=17450) [edit] > Reduced test case > > The issue here is that the "startMonth" <select> element has a style of "width: > 51px;" and the "startDay" <select> element has a style of "width: 40px;", both > of which are too narrow for WebKit. > > This is an evangelism issue since Hotwire.com needs to change the width of the > <select> elements (or the font size) for them to render correctly with WebKit. Note that the "startDay" <select> element has changed from "width: 40px;" to "width: 42px;" in recent emails from Hotwire, but this still isn't wide enough for WebKit. Also note that the <font> tag surrounding the two <select> tags has no effect on the font size used in the <select> elements. (In reply to comment #6) > > This is an evangelism issue since Hotwire.com needs to change the width of the > > <select> elements (or the font size) for them to render correctly with WebKit. > > Note that the "startDay" <select> element has changed from "width: 40px;" to > "width: 42px;" in recent emails from Hotwire, but this still isn't wide enough > for WebKit. My testing reveals that "startMonth" should be 52px wide while "startDay" should be 44px wide with the current font and font-size. <select name="startMonth" style="width: 52px;"> <select name="startDay" style="width: 44px;"> |