i’m trying to create following layout:
but without setting the width, like:
is this possible?
i’m trying to create following layout: http://jsfiddle.net/BTuMH/1/ but without setting the width, like: http://jsfiddle.net/yuGyg/
Share
Sign Up to our social questions and Answers Engine to ask questions, answer people’s questions, and connect with other people.
Login to our social questions & Answers Engine to ask questions answer people’s questions & connect with other people.
Lost your password? Please enter your email address. You will receive a link and will create a new password via email.
Please briefly explain why you feel this question should be reported.
Please briefly explain why you feel this answer should be reported.
Please briefly explain why you feel this user should be reported.
i’m trying to create following layout:
but without setting the width, like:
is this possible?
http://jsfiddle.net/BTuMH/3/
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
labelelement instead of adivwith classlabel) and use css to give theinputmaximum width.Update:
This only works for firefox. This doesn’t work for webkit. I hoped that using
display: block;on theinputelement, it would calculate it’s width by taking maximum space available behind the floatedlabel. This does not work. I guess you’ll have to use javascript to set the width after rendering the page.Yet another update:
I’ve made it work!
See http://jsfiddle.net/BTuMH/4/
With
overflow: hidden;on adivwrapper, the input element can get 100% width, where 100% width is the width of thediv. It didn’t work before because the space behind the floated element was also occupied by thediv, usingoverflow:hidden;fixes that.