Vertical positioning error under Chrome |
Vertical positioning error under Chrome |
NitroPress |
Oct 12 2011, 10:14 AM
Post
#1
|
Group: Members Posts: 8 Joined: 12-October 11 Member No.: 15,608 |
I have a simple XHTML/CSS site that uses an absolutely positioned div within another to highlight the current page menu selection (represented by graphic text blocks). I've gone over the code several times and validated it, and I am still seeing a cumulative positioning error under Chrome.
Under FF and IE, the marker box positions correctly all the way down. Under Chrome, there is a cumulative error of about 2% so that by the time the marker is on the bottom menu item, it's a dozen pixels off center. I've run into many positioning errors and know the usual fixes, but those usually involve a fixed offset or a top-item only offset. Here is the relevant code: CODE #navbar { float: left; min-width: 200px; max-width: 200px; position: relative; padding: 9px 0 0 0; line-height: 1.25; } #navbar img { margin: 0 0 20px 0; padding: 0; border: none; } #navbar .markbox { position: absolute; min-width: 200px; max-width: 200px; height: 30px; border-top: 2px solid #c99; border-bottom: 2px solid #c99; z-index: -5; } And the page, still under development and please ignore all ragged edges, is temporarily here: http://www.nitropress.com/CLIENT_TEST/MalamaPono/index.php I've gone through several iterations trying to suppress border widths and other rendering variables, and none of them has changed the basic strange cumulative error. Any pointers or thoughts appreciated - I don't really want to go to browser-specific hacks on such a simple page if I can avoid it. |
Lo-Fi Version | Time is now: 23rd April 2024 - 04:18 PM |