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

• 
  Change Background With SetInterval
• 
  Make Wave Effect For Images
• 
  How To Make A Navigation Which Disappears While Scrolling Down But Shows Up By Scrolling Up?
• 
  Does Not Apply Class To The Columns Of A Table