ebbe,
Just a quick note, in my HTML, the labels aren't actually set up correctly, as they should either wrap around the whole input element like so:
Code: Select all
<label>Username<input type="text" name="username"></label>
OR, it should include the 'for' attribute, like so:
Code: Select all
<label for="username">Username</label><input type="text" name="username">
As you can see, I've done neither, so the browser doesn't know which label belogns to which element.
Code: Select all
<div><label class="real">Name</label><input type="text" name="m3username" id="m3username" value="" size="30" maxlength="150" />
</div>
<div><label class="real">Email</label><input type="text" name="m3email" id="m3email" value="" size="30" maxlength="150" />
</div>
I might fix this up in the future if I get bored/annoyed enough.
Back to your actual question
I'm not 100% sure what you're asking, so I'll just cover everything
As for the css, this is the only css that is used for the mailing list signup form:
Code: Select all
#joinmailing div {
margin-top: 5px;
}
#joinmailing label {
display:none;
}
#joinmailing input {
width: 155px;
font-size: 10px;
}
#joinmailing input.submit {
width: auto;
}
#joinmailing label.real {
display:block;
float:left;
width: 50px;
line-height: 16px;
}
#joinmailing form {
margin-bottom: 30px;
}
As you can see, I set
all labels to
display: none; , and then only show the 'real' labels that I actually want using the 5th rule block above.
To actually get this output, this is the Newsletter Made Simple signup form template, configured in the NMS control panel in the 'Subscribe' tab:
Code: Select all
{if $message ne ""}
<p id="subscribe_message">{$message}</p>
{/if}
{$formstart}
{$formhidden}
<div><label class="real">{$prompt_username}</label>{$username}</div>
<div><label class="real">Email</label>{$email}</div>
{foreach from=$listids item=curr_id}
{$curr_id}<br/>
{/foreach}
<div><label class="real"> </label><input type="submit" value="Sign Up" class="submit"></div>
{$formend}
ps. the only reason I have used a blank label for the submit button is to get it to line up with the other form elements.
pps. I have now fixed the incorrect label usage. I'm still going to leave the notes above though, as I don't think many people are using labels properly, or know that there are two different menthods that can be used.
for the mailing list.
