<style type = "text/css">
div {
margin-bottom: 5px;
}
label {
display: block;
float: left;
width: 150px;
text-align: right;
font-weight: bold;
margin-right: 10px;
}
input.submit {
margin-left: 160px;
}
</style>
First, I added 5 pixels of margin to the bottom of the <div> elements to space out the form elements a bit. Then, I used CSS to align the form fields vertically and right-align the labels. You can only apply widths to block-level elements, so I set the display property on the labels to block. Then I used float: left and a width of 150 pixels to get the form fields to move to the right of the labels. Setting the text-align property to right for the labels moves them to the right side of the 150-pixel box I put them in. Then I just added a 10-pixel margin to create some space between the labels and the form fields and bolded the label text. To get the Submit button, which has no label, to line up with the other form fields, I added a 160-pixel right margin. That’s 150 pixels for the label and 10 pixels for the margin I added to the labels. There has not been anymore explanation of the CSS labels elsewhere.
This is from NLL409 NLL404 set label width as 150px. I had to change it 300px to avoid wrapping the text below.
This is from NLL411
This is from NLL412 Note there is no style for input here. Input is inside label tags.
This is from NLL413 - Creating password control
Script is from NLL414 - Input is inside label tags. In the example output the checkbox appears after the text on NLL415. My script here shows the checkbox after the text. I had to add <br /> at the end before the line was drawn. Also after the second display example.
Check all symptoms that you are experiencing:
