Why Fieldset Inside Flex Act Differently Between Browsers

I wrote this sample code:

Solution 1:

On Chrome the <fieldset> is given a min-width equal to the width of the content. You can remove this by putting in min-width: 0px; in the <fieldset> style.

http://jsfiddle.net/wpe03rs6/2/

Solution 2:

You can put chrome hack css something like this:

@media screen and (-webkit-min-device-pixel-ratio:0)
{ 
    #element { properties:value; } 
}

may be this will help you.

Solution 3:

Try like this: Demo

body {
    overflow-x:hidden;
}

HTML:

<divstyle="white-space: nowrap; width:100%; overflow:auto;display:block"><fieldset>...  </fieldset></div>

Updated demo

Share

You may like these posts

• 
  How To Display Source Code With Indent In A Web Page? Html? Css?
• 
  Is Google Using "defer" The Wrong Way?
• 
  Page Loading Status
• 
  Ie Not Showing Whole Text From Topojson - Just 2-3 Words