Side navigation
#8002 closed bug (worksforme)
Opened January 18, 2011 09:51PM UTC
Closed January 20, 2011 12:50AM UTC
Issues in Safari/Chrome to calculate position, innerWidth when an image without a declared width is in the layout
| Reported by: | scannercf | Owned by: | scannercf |
|---|---|---|---|
| Priority: | low | Milestone: | 1.next |
| Component: | dimensions | Version: | 1.4.4 |
| Keywords: | Cc: | ||
| Blocked by: | Blocking: |
Description
I have a set of left-floated <div>s that contain an <ul><li><a> structure (a menu!). After CSS it looks like a set of tabs with horizontal sub-menus below.
Download links below the issue's explanation..
When the first tab contains an <a> link with an image within AND the image does not have a declared width in the HTML ( <a href="#"><img src="images/home-icon.png" /></a> ), Safari and Chrome cannot properly calculate the second tab left position because it doesn't take the image's width into account.
When you declare the image's width ( <img src="images/home-icon.png" width="16" /></a> ) or you replace the image with a simple text link, then it works fine.
No problems with Firefox / Opera... Haven't tested in IE yet, but I think is a webkit issue.
Download files and screenshots here:
http://www.box.net/shared/static/9hl4pm4nhc.zip
NOTE: the position and width values you see in the screenshots (Firefox vs Safari) are jQuery-calculated. Firefox declares a width of 46px, while Safari declares 30 (the image's width is 16 pixels)
Thanks for taking the time to contribute to the jQuery project! Please provide a reduced jsFiddle test case to help us assess your ticket!
Additionally, test against the jQuery 0 GIT version to ensure the issue still exists. Be Excellent to eachother!