Jump to content
Killersites Forums

Checkboxes/radiobuttons appearing below label

Recommended Posts

Hi guys


I have just completed the video; DW Disc 2 Chapter 5 03 from the Complete Web Designer course.


Please have a look at the contact page here;


Notice that the labels for the checkboxes and also the radio buttons actually appear underneath them, rather than to the left where they should be.


I looked at the code and it appears the same as it is in the instruction videos.


Can anyone throw any light on why this is happening?


*Edit; of course I guess I could always not worry about it for now, since I believe the elements are going to be styled with CSS later on?

Link to post
Share on other sites

Input tag should not be contained within the label tag.


As for the alignment issue, your input tag has been defined as a block element in your css.


Thank you, I did not see that input tag in the CSS.


Could you expand on why the input tag should not be contained in the label tag? That's the way dreamweaver seems to write the code...

Link to post
Share on other sites

first, plwase be more exact on the video that you are referring to for I can go watch it and see what you are doing.

second, <label for="test">testing</label>

<textarea name="test" id="test" cols="45" rows="5" tabindex="10"></textarea>


In the label tag the for is called in DW the for attribute, this puts the label before the textarea. This is if you are useing DW spry or you can hand code it.


Third, you do not have to, but I always put in a tab index in increments of 10. Ten because it is easy to remember and then you have space incase you have to go back in later and put in more input fields.


You can put the hole above code in a <p> tag for styling with css. Hopes this helps a little.

Link to post
Share on other sites

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.
Note: Your post will require moderator approval before it will be visible.

Reply to this topic...

×   Pasted as rich text.   Paste as plain text instead

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

  • Create New...