Is it possible to create a form with input fields filling out all available space?
i'm trying to create following layout:
but without setting the Width, like:
is this possible?
Get rid off those divs, you don't need those? I've fiddled a somewhat cleaner version. Float the label (yes, you can use a
label element instead of a
div with class
label) and use css to give the
input maximum width.
This only works for firefox. This doesn't work for webkit. I hoped that using
display: block; on the
input element, it would calculate it's width by taking maximum space available behind the floated
Yet another update: I've made it work!
overflow: hidden; on a
div wrapper, the input element can get 100% width, where 100% width is the width of the
div. It didn't work before because the space behind the floated element was also occupied by the
overflow:hidden; fixes that.
This post first appeared on CSS3 Recipes - The Solution To All Your Style Problems, please read the originial post: here