html text input and checkboxes. css Issue -
edit: looks now: https://jsfiddle.net/vmd7m3yh/5/ it's better, definitely, need sort out how list inputs correctly.. kinda messy right now.
i running problem in html/css. trying make this:
the problem dont know how can align them way. have tried use float on the input , checkbox, checkbox pushed first label.
current situation:
https://jsfiddle.net/vmd7m3yh/
the css specific div @ bottom of file.
any idea should change? quite ashamed of asking question on html. please, nice :)
/*custom form*/ .workorder-form { margin-bottom: 5px; } .workorder-form form { margin-top: 15px; width: 500px; } .workorder-form label { margin-top: 5px; } .workorder-form input[type=text] { float: right; margin-top: 5px; } .workorder-form input[type=checkbox] { background-color: yellow; } .workorder-form textarea { width: 350px; height: 200px; padding-bottom: 5px; }
<div class="workorder-form"> <form class="workorder-form"> <h4>@resources.workreport</h4> <label>some label</label> <input type="text" name="ordernumber" value="" /> <input type="checkbox" name="vehicle" value="bike">i have bike<br /> <label>some label</label> <input type="text" name="phone" value="" /> <input type="checkbox" name="vehicle" value="bike">i have bike<br /> <label>some label</label> <input type="text" name="email" value="" /> <input type="checkbox" name="vehicle" value="bike">i have bike<br /> <label>some label</label> <input type="text" name="email" value="" /> <input type="checkbox" name="vehicle" value="bike">i have bike<br /> <label>some label</label> <input type="text" name="email" value="" /> <input type="checkbox" name="vehicle" value="bike">i have bike<br /> <label>some label</label> <input type="text" name="email" value="" /> <input type="checkbox" name="vehicle" value="bike">i have bike<br /> <label>some label</label> <textarea name="email" value=""></textarea><br /> </form> </div>
edit: looks now: https://jsfiddle.net/vmd7m3yh/5/ it's better, definitely, need sort out how list inputs correctly.. kinda messy right now.
your inputs big on fiddle, try adding
input { height: 30px; }
in css , see
edit : can add bootstrap external resource on left of fiddle instead of copying in css box :)
Comments
Post a Comment