Streaming live at 10am (PST)

Using display: table with webflow


#1

Hello

I realise webflow does not currently have a GUI for using display: table, but assumed I should be able to achieve this pen http://codepen.io/timoto/pen/vLyzoX with a mix of webflow's custom code page + GUI.

However when viewing my webflow conversion effort here:
http://display-table.webflow.io/

the browser, Chromium, momentarily renders a big white space below the row and after about 1-2 secs renders correctly. Firefox 43 is not producing the expected results either.

Should all be useable:
http://caniuse.com/#search=display%3A%20table

Any ideas as to what I'm doing wrong in Webflow ?
https://preview.webflow.com/preview/display-table?preview=62bc08467bd7c7b7a015055ea40e530f


Image to occupy 100% remaining viewport height or 100% column width depending on portrait or landscape orientation respectively in a single class
#2

strange. it renders differently in chrome than in chrome incognito


#3

@Revolution It also renders very poorly in FF 43.

There is obviously something wrong with the way it has been creted in Webflow, but I can't figure out what.


#4

@bart any ideas on why this custom code isn't rendering properly?


#5

Adding height: 100%; to .myrow solved the issue for Firefox for me. The parent element of the cells (row) didn't have a height specified.


#6

Thank you @bart, I have made that change now.

For some reason I didn't need to set height: 100% to .myrow in the codepen.

I wonder why there is that different behviour ?


#7

This topic was automatically closed 60 days after the last reply. New replies are no longer allowed.