Piccoli dubbi inserimento dati per iscrizione form html

[Perulli]

Salve a tutti. Ho inserito il codice html di un sito che gestisce newsletter nel widget testo del mio sito per creare un form di iscrizione. L'ho modificato un pò ma mi sono bloccato su alcuni piccoli aspetti:
1)Come si tolgono gli spazi tra una voce e l'altra?
2)All'interno del campo nome ed email vorrei che la scritta scomparisse quando si clicca nella casella di testo e riapparisse quando si clicca altrove. Sono riuscito solo a farla scomparire con la voce "onfocus" ma poi non riappare.

Vi allego il codice (anche se forse non serve) sperando nel vostro aiuto

<!-- Begin MailChimp Signup Form -->
<link href="//cdn-images.mailchimp.com/embedcode/classic-081711.css" rel="stylesheet" type="text/css">
<style type="text/css">
    #mc_embed_signup{background:#F4C75A; clear:left; font:14px Helvetica,Arial,sans-serif; }
    /* Add your own MailChimp form style overrides in your site stylesheet or in this style block.
       We recommend moving this block and the preceding CSS link to the HEAD of your HTML file. */
</style>
<div id="mc_embed_signup">
<form action="//altervista.us8.list-manage.com/subscribe/post?u=72200de848e41e20c0c01e83c&amp;id=20514ba85f" method="post" id="mc-embedded-subscribe-form" name="mc-embedded-subscribe-form" class="validate" target="_blank" novalidate>
    <div id="mc_embed_signup_scroll">
<font size="4">
    <h2>Iscriviti alla Newsletter</h2></font>
<font size="3">Inserisci i tuoi dati per non perdere i miei nuovi articoli.
Ogni email sarà ben selezionata e se non sei soddisfatto puoi disiscriverti in qualsiasi momento.</font><br><br>
<div class="mc-field-group">
    <label for="mce-NOME"></label>
    <input type="text" value="Il tuo Nome" name="NOME" class="" id="mce-NOME" onfocus="this.value=''">
</div>
<div class="mc-field-group">
    <label for="mce-EMAIL"></label>
    <input type="email" value="Il tuo indirizzo Email" name="EMAIL" class="required email" id="mce-EMAIL" onfocus="this.value=''">
</div>
<div class="mc-field-group input-group">
     <ul><li><input type="checkbox" value="Acconsento al trattamento dei dati personali" name="ACCONSENTO" id="mce-ACCONSENTO-0"><label for="mce-ACCONSENTO-0"><font size="1">Ho letto<a target="_blank" href="http://dredobokeh.altervista.org/policy/" style=" color:#0066ff"><u>l'informativa sulla privacy</u></a>e acconsento al trattamento dei miei dati personali ai sensi dell'art. 13 del D. Lgs. 196/2003.</font></label></li>
</ul>
</div>
    <div id="mce-responses" class="clear">
        <div class="response" id="mce-error-response" style="display:none"></div>
        <div class="response" id="mce-success-response" style="display:none"></div>
    </div>    <!-- real people should not fill this in and expect good things - do not remove this or risk form bot signups-->
    <div style="position: absolute; left: -5000px;"><input type="text" name="b_72200de848e41e20c0c01e83c_20514ba85f" tabindex="-1" value=""></div>
<center>
    <div class="clear"><input type="submit" value="Iscrivimi" name="subscribe" id="mc-embedded-subscribe" class="button" style="background-color: #ab7c0b;" style="color: #ffffff;"></div>
</center>
    </div>
<font size="1">Leggi l'informativa estesa sulla<a target="_blank" href="http://dredobokeh.altervista.org/policy/" style=" color:#0066ff"><u>privacy</u></a></font>
</form>
</div>
<script type='text/javascript' src='//s3.amazonaws.com/downloads.mailchimp.com/js/mc-validate.js'></script><script type='text/javascript'>(function($) {window.fnames = new Array(); window.ftypes = new Array();fnames[1]='NOME';ftypes[1]='text';fnames[0]='EMAIL';ftypes[0]='email';fnames[3]='ACCONSENTO';ftypes[3]='radio'; /*
 * Translated default messages for the $ validation plugin.
 * Locale: IT
 */
$.extend($.validator.messages, {
       required: "Campo obbligatorio.",
       remote: "Controlla questo campo.",
       email: "Inserisci un indirizzo email valido.",
       url: "Inserisci un indirizzo web valido.",
       date: "Inserisci una data valida.",
       dateISO: "Inserisci una data valida (ISO).",
       number: "Inserisci un numero valido.",
       digits: "Inserisci solo numeri.",
       creditcard: "Inserisci un numero di carta di credito valido.",
       equalTo: "Il valore non corrisponde.",
       accept: "Inserisci un valore con un&apos;estensione valida.",
       maxlength: $.validator.format("Non inserire pi&ugrave; di {0} caratteri."),
       minlength: $.validator.format("Inserisci almeno {0} caratteri."),
       rangelength: $.validator.format("Inserisci un valore compreso tra {0} e {1} caratteri."),
       range: $.validator.format("Inserisci un valore compreso tra {0} e {1}."),
       max: $.validator.format("Inserisci un valore minore o uguale a {0}."),
       min: $.validator.format("Inserisci un valore maggiore o uguale a {0}.")
});}(jQuery));var $mcj = jQuery.noConflict(true);</script>
<!--End mc_embed_signup-->

[WottaFacca]

Per far si che ci sia la scritta che "sparisce" quando ci vuoi scrivere e ri compare quando la casella di testo è libera di basta inserire la voce "placeholder"

<input type="email" name="EMAIL" class="required email" id="mce-EMAIL" placeholder="Il tuo indirizzo Email">

[Perulli]

Per far si che ci sia la scritta che "sparisce" quando ci vuoi scrivere e ri compare quando la casella di testo è libera di basta inserire la voce "placeholder"

<input type="email" name="EMAIL" class="required email" id="mce-EMAIL" placeholder="Il tuo indirizzo Email">

Fatto! Grazie mille!!!

Mentre per togliere gli spazi da una voce e l'altra sai come si fa? Nel dettaglio mi interessa togliere lo spazio che c'è tra la casella di testo "email" e la checkbox

[WottaFacca]

Devi andare a modificare il CSS, perchè il checkbox è dentro un <li> che è dentro un <ul> che è dentro ad un <div> con 2 classi, quindi qualche classe avrà delle impostazioni da modificare per modificare la distanza.

Devi cercare in particolare queste 2 classi "mc-field-group" "input-group", però occhio perchè altri dati potrebbero utilizzarle, quindi modificheresti anche altre cose

[Perulli]

Ok come non detto allora lascio tutto invariato. Grazie di tutto e buona giornata!!

[WottaFacca]

Ok come non detto allora lascio tutto invariato. Grazie di tutto e buona giornata!!

Potresti togliere le regole su quel <div>, in modo da vedere dove va a finire e poi assegnare un nuovo ID con regole create da te, in modo da non "rovinare" niente