html - Displaying a table next to a fixed width span -

html - Displaying a table next to a fixed width span -

i have html <table> have dynamic width (changes window size), , fixed width <span> (500px).

i want display both next each other both fill whole width of parent container

i want using css (not js)

i have been playing around css seems ruining table's width

html

<div class='container'> <table class='table'>....</table> <span class='span'>....</span> </div>

css

.container { ...... } .table { ..... } .span { width: 500px; display: inline-block; //or block if neccessary }

you may give seek table-layout propertie .container , span.

browsers should create element missing produce first table-cell.

demo

span { display:table-cell; width:500px; border:solid; } table { border:solid; margin:0; width:100%; } .container { display:table; width:100%; table-layout:fixed; }

this should work

because of table-layout:fixed

and because browser should create missing element (like tbody produced in <table> when missing or when in document missing either tags html or body ).

html css