Supprimer "espaces" entre les éléments div

C'est mon code HTML

<div id="div1">
    <div></div><div></div><div></div><br/><div></div><div></div><div></div>
</div>

Mon CSS:

#div1 {
    width:150px;height:100px;white-space:nowrap;
    border:blue 1px solid;padding:5px;
}
#div1 div {
    width:30px;height:30px;
    border:blue 1px solid;
    display:inline-block;
    *display:inline;zoom:1;
    margin:0px;outline:none;
}

Si j'insère le <!DOCTYPE html> avant la <html> balise, la page ressemble à ceci:

Supprimer

Mais si je supprime le <!DOCTYPE html> balise, les "espaces blancs" entre les deux lignes seront supprimer
Supprimer

Mais je voudrais utiliser <!DOCTYPE html> tag, il est conseillé, mais je ne trouve pas de règle CSS qui permet de supprimer que l'espace blanc, j'ai utilisé margin:0;outline:none; etc... mais il ne fonctionne pas , quelqu'un m'aider. Merci!( Je ne suis pas très bonne en anglais ...)

source d'informationauteur phibao37