Bug 49662
| Summary: | Wrong alignement of boxes with direction:rtl | ||
|---|---|---|---|
| Product: | WebKit | Reporter: | Arash <ttt2459> |
| Component: | Layout and Rendering | Assignee: | Nobody <webkit-unassigned> |
| Status: | RESOLVED WONTFIX | ||
| Severity: | Normal | CC: | ahmad.saleem792, flackr, yael |
| Priority: | P2 | ||
| Version: | 528+ (Nightly build) | ||
| Hardware: | PC | ||
| OS: | Windows 7 | ||
Arash
Considering the code below, I believe according to the standards the #blue box should be aligned on the right edge with the #red box because of the direction:rtl of the parent container (#blue_container) but WebKit browsers (Safari/Chrome) align them on the left edge. All non-WebkKit browsers (even WebKit without the DOCTYPE tag) align the boxes on the right edge.
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html>
<head>
<style>
#top_container {
float:right;
}
#red {
background:#f00;
color:#fff;
padding:10px;
}
#blue_container {
direction:rtl;
}
#blue {
position:absolute;
background:#00f;
color:#fff;
padding:10px;
width:200px;
direction:ltr;
}
</style>
</head>
<body>
<div id="top_container">
<div id="red">
red
</div>
<div id="blue_container">
<div id="blue">
blue
</div>
</div>
</div>
</body>
</html>
| Attachments | ||
|---|---|---|
| Add attachment proposed patch, testcase, etc. |
Robert Flack
I believe this is a duplicate of <a href="/show_bug.cgi?id=19124">bug 19124</a>
Ahmad Saleem
Took test from Comment 0 and changed to JSFiddle: https://jsfiddle.net/oj5mnb08/
Safari Technology Preview 164, Chrome Canary 112 and Firefox Nightly 112 all render it same. This bug was never got to "New" so changing status to "RESOLVED WONTFIX".
Please reopen if it is still reproducible. Thanks!