Home/ Questions/Q 993683
In Process

The Archive Base Latest Questions

Editorial Team
  • 0
Asked: 2026-05-16T06:27:47+00:00

I am new to CSS, so please bear with me. I have this form

  • 0

I am new to CSS, so please bear with me. I have this form which I’m trying to style. Everything works fine, except the confirmation label which is in a div. I want some space to be there between div.field, and while this works for all the input elements, it doesn’t work for the label message which is at the bottom. I tried increasing margin-top, but to no avail. I would like that element to be positioned in the center.

Using the web-developer addon of Firefox, it shows me that the width and height of div.field of label tag specifically is 284px and 209px respectively. Why is this so, when I haven’t set it that way?

You can view the code live at jsfiddle: http://www.jsfiddle.net/yMHJY/

Share

Leave an answer

You must login to add an answer.

Need An Account,

1 Answer

  1. Editorial Team

    The solution is simple, really. Add a margin-top to the parent of the label element, and add overflow: hidden to the div#contact div .field selector.

    However, can I just say that the code can be rewritten for much better efficiency and semantic correctness. For instance, I would contain the last massage in a p tag and not a label in a div. Also, I would have each input element placed in an unordered list ul instead of divs. You also have a lot of unnecessary floats and the br at the end of each input is wholly uneeded. Oh, and unless you are embedding Calluna somehow, don’t use it – stick to web safe fonts (and if you are, you still need to suggest an alternative, in the user’s browser does not support it, and also to give the browser something to display while the font loads).

    Edit

    Fixed the load for ya, I should be paid for this kind of stuff 🙂 Just stick to better HTML and CSS next time.

    http://www.jsfiddle.net/SNrtA/

    • 0