Yahoo Answers is shutting down on May 4th, 2021 (Eastern Time) and the Yahoo Answers website is now in read-only mode. There will be no changes to other Yahoo properties or services, or your Yahoo account. You can find more information about the Yahoo Answers shutdown and how to download your data on this help page.
Trending News
HTML - Align the start of form input box with text before the box?
I have a webpage that looks like this: http://puu.sh/5zHcT/1b8d9c9aff.png
As you can see, the start of the text box section is lined up, but some of the boxes have text in front.
I'd like to have the start of each text box lined up instead. I put together a quick photoshopped image of what I'd like it to look like, hopefully this helps you understand it: http://puu.sh/5zHAh/da3aa1bae4.png
Is it possible to do this? Preferably using just CSS and/or HTML, but Javascript if necessary.
I should note, I avoid using tables when I can since the code looks messy to me.
3 Answers
- 8 years agoFavorite Answer
Use Table Interface
Like
<tr>
<td>Text</td>
<td><Input Box></td>
</tr>
OR
Use Div and CSS
Legand Tag need to set with CSS Left
Input Tag Need to be set with Css right
- 8 years ago
Easiest approach is to use table. Copy next lines inside your <body> tag, set some <table>, <tr>, <td> attributes to suit your needs:
<table>
<tr>
<td>Item name:</td>
<td></td>
<td><input type="text" /></td>
</tr>
<tr>
<td>Image path:</td>
<td align="right">/images/item/</td>
<td><input type="text" /></td>
</tr>
<tr>
<td>Price:</td>
<td align="right">AUD $</td>
<td><input type="text" /></td>
</tr>
</table>
- Anonymous8 years ago
basically you want to float the right column to the right (normally its left), put it in a table and float the righter columns to the right (dont forget to give it a width)