search

contao / core

Contao 3 → see contao/contao for Contao 4
GNU Lesser General Public License v3.0
491 stars 213 forks source link

Backend css rule for class .w50 not working for checkboxes #8864

Closed eBlick closed 6 years ago

eBlick commented 6 years ago

Checkboxes need sometimes more space. When using .w50 Class for custom backend elements the checkbox is limited to 80px height. We should use a min-height: 80px instead.

bildschirmfoto 2018-03-13 um 08 23 17

image_1325

fritzmg commented 6 years ago

You should use w50 only for single ones. Or use tl_style => 'height:auto'.

eBlick commented 6 years ago

Why build a workaround with inline-styles? What's the problem with a CSS change that would work in general?

leofeyer commented 6 years ago

If we can be sure that min-height works in all browsers and does not cause any side-effects, I'd be in favor of this solution.

Aybee commented 6 years ago

And again it seems to be time for a flexbox solution.

eBlick commented 6 years ago

THX

leofeyer commented 6 years ago

If we can be sure that min-height works in all browsers and does not cause any side-effects

Did anyone test this?

leofeyer commented 6 years ago

@contao/developers /cc

eBlick commented 6 years ago

as far as I am concerned it worked in safari, firefox and chrome in osx environment.

leofeyer commented 6 years ago

We need some more people to test this please. @frontendschlampe @may17 @fritzmg @cliffparnitzky @ausi @Pellinger @netzarbeiter /cc

fritzmg commented 6 years ago

In general this works. Here are two screenshots from Contao 4.5 from FireFox and IE 11 under Windows 10 x64:

w50ff

w50ie11

In this test I added the w50 class to all the widgets within the Stylesheets section of the page layout and changed the height of .w50 to min-height.

Since the height of one w50 element can now be anything, the resulting layout may look a little off, since you will not know how many elements will float to the right (or left) of the w50 element. This may result in some whitespace in odd places - as seen above.

may17 commented 6 years ago

min-height has full browser support see https://caniuse.com/#feat=minmaxwh

cliffparnitzky commented 6 years ago

I can confirm the test of @fritzmg : used Contao 4.4 in Chrome, Firefox and IE 11

leofeyer commented 6 years ago

Changed in contao/contao@a3f4e867aaa57e21927a45ba9b3846a6369c169f.