flex-direction not working properly in button

RESOLVED DUPLICATE of bug 984869

Status

()

RESOLVED DUPLICATE of bug 984869
2 years ago
2 years ago

People

(Reporter: enzo.dellegrazie, Unassigned)

Tracking

48 Branch
Points:
---

Firefox Tracking Flags

(Not tracked)

Details

Attachments

(1 attachment)

511 bytes, text/html
Details
(Reporter)

Description

2 years ago
Created attachment 8759983 [details]
testCase.html

User Agent: Mozilla/5.0 (Windows NT 10.0; WOW64; rv:48.0) Gecko/20100101 Firefox/48.0
Build ID: 20160604004005

Steps to reproduce:

- Set the style of <button> with "display:flex; flex-direction:row;".
- Add more <div> in button



Actual results:

the <div> added into the <button> are placed in top to down direction


Expected results:

the <div> added into the <button> are placed in left to right direction
(Reporter)

Updated

2 years ago
OS: Unspecified → Windows 10
Hardware: Unspecified → x86_64
(Reporter)

Comment 1

2 years ago
A more detailed analysis suggests that the <button> not yet manages the "display:flex" style attribute or other properties of the CSS Flexible Box Layout (see https://www.w3.org/TR/css-flexbox-1/).

It's right what I have observed?
It is planned the implementation in the future?
(Reporter)

Updated

2 years ago
Component: Untriaged → General
Priority: -- → P3

Comment 2

2 years ago
getComputedStyle returns the correct flex/row answers for display/flexDirection, so if anything this would be a layout issue. Dan, can you help?
Component: General → Layout
Flags: needinfo?(dholbert)
Product: Firefox → Core
Summary: flex-direction not work properly in button → flex-direction not working properly in button

Updated

2 years ago
OS: Windows 10 → All
Priority: P3 → --
Hardware: x86_64 → All
(In reply to Enzo from comment #1)
> A more detailed analysis suggests that the <button> not yet manages the
> "display:flex" style attribute or other properties of the CSS Flexible Box
> Layout (see https://www.w3.org/TR/css-flexbox-1/).

Correct, essentially. This is already tracked in Bug 984869.

> It is planned the implementation in the future?

(Yes.)
Status: UNCONFIRMED → RESOLVED
Last Resolved: 2 years ago
Flags: needinfo?(dholbert)
Resolution: --- → DUPLICATE
Duplicate of bug: 984869
In the meantime: if you like, you should be able to work around this by adding a <div> wrapper inside of the <button> (around its children), and set your flexbox styles on that <div>.
(Reporter)

Comment 5

2 years ago
thank you for your suggests.
bye
You need to log in before you can comment on or make changes to this bug.