CSS Table layout: make rows span full width without centering cells -
i have layout shown in fiddle: https://jsfiddle.net/4dbgnqha/4/. reasons can read in this post, don't want change way page laid out.
now, works well, issue when add border bottom of .item divs, realize don't span full width of page. can see in above fiddle, second .item down doesn't have enough content fill width, border doesn't reach full width.
i thought fix adding .item { width: 100%; }, when that, image gets added enough additional width center p, looks weird. demo of that: https://jsfiddle.net/4dbgnqha/7/
i know fix if add set width image, mentioned in original post, want flexible, able have many image widths. know if wrap image in element , set element small width, 1px, work, seems hack, , reason i'm doing stupid table layout in first place i'm trying avoid such hacks.
how can fix issue?
you can add css, it's hack, works table layout.
.item p { width: 100%; }