- This topic is empty.
-
AuthorPosts
-
June 26, 2016 at 11:04 am #243169
jackett_dad
ParticipantI am trying to create a layout that will display a set of dialog labels and fields in the middle, with a column to the left and right of all of these that spans all rows.
The code pen for this can be seen here: http://codepen.io/jackett_dad/pen/wWgyvM?editors=1111
This works in Chrome, but not in IE11 and I wouldd like them both the behave the same. The view should be shown as having an asterisk centered vertically in the first column and last column spanning four columns (or however many columns are in the middle two rows), and the middle two columns shows four labelled fields.
In IE11 (I need this for IE10 as well, but I have not even looked yet), things are a couple problems with the layout but I will settle for solving the first issue of the label column not filling the available width as it does in Chrome.
Any help would be appreciated.
Scott
June 27, 2016 at 4:07 am #243187Atelierbram
ParticipantWould you do feature-detection with Modernizr, or with a small javascript snippet in order to target browsers that don’t understand flexbox?
June 27, 2016 at 5:44 am #243189jackett_dad
ParticipantI have the luxury of knowing that the product I’m working only needs to support IE10+ and Chrome. However, I’ve just realized that I may need to support IE9 and that I think blows the whole idea of using Flexbox away, unless I can use the polyfill without suffering too big a performance hit. So the answer is, I don’t need the javascript snippet for detection–I already have a way to detect the browser version and I am lead to believe that IE10 and 11 support flex displays.
June 28, 2016 at 4:25 am #243213Atelierbram
Participantthings are a couple problems with the layout but I will settle for solving the first issue of the label column not filling the available width as it does in Chrome
Kind of faked it here by giving the wrapper section the same lightblue background-color. Feels strangely hacky doing this with
display: table
and floats now in stead of flexbox, but I hope this is helpful. -
AuthorPosts
- The forum ‘CSS’ is closed to new topics and replies.