Bug 68583 - inline-block elements don't resize when they contain vertical flow elements
Summary: inline-block elements don't resize when they contain vertical flow elements
Status: RESOLVED CONFIGURATION CHANGED
Alias: None
Product: WebKit
Classification: Unclassified
Component: Layout and Rendering (show other bugs)
Version: 528+ (Nightly build)
Hardware: Unspecified Unspecified
: P2 Normal
Assignee: Nobody
URL: https://jsfiddle.net/19xt54w2/show
Keywords:
Depends on:
Blocks:
 
Reported: 2011-09-21 16:18 PDT by Ojan Vafai
Modified: 2023-06-29 16:40 PDT (History)
4 users (show)

See Also:


Attachments

Note You need to log in before you can comment on or make changes to this bug.
Description Ojan Vafai 2011-09-21 16:18:17 PDT
<div style="display:inline-block;-webkit-writing-mode: horizontal-tb;background-color:orange">
    <div style="height: auto; -webkit-writing-mode: vertical-rl; background-color: red">asdf</div>
    <div style="height: 100%; -webkit-writing-mode: vertical-rl; background-color: green">asdf</div>
</div>

http://plexode.com/eval3/#ht=%3Cdiv%20style%3D%22display%3Ainline-block%3B-webkit-writing-mode%3A%20horizontal-tb%3Bbackground-color%3Aorange%22%3E%0A%20%20%20%20%3Cdiv%20style%3D%22height%3A%20auto%3B%20-webkit-writing-mode%3A%20vertical-rl%3B%20background-color%3A%20red%22%3Easdf%3C%2Fdiv%3E%0A%20%20%20%20%3Cdiv%20style%3D%22height%3A%20100%25%3B%20-webkit-writing-mode%3A%20vertical-rl%3B%20background-color%3A%20green%22%3Easdf%3C%2Fdiv%3E%0A%3C%2Fdiv%3E%0A

When you resize the window, the outer div should change size. If you make it display:block, it resizes correctly when you resize the window.
Comment 1 Ahmad Saleem 2023-06-24 06:34:00 PDT
It seems to look fine in Safari Technology Preview 172 and looks similar to Chrome Canary 116.

@Alan - do we need to track it?