To jest normalne zachowanie i nieważne czy otwierasz to pod IE czy pod najnowszym Firefoxem - uzyskasz taki sam efekt.
Ponieważ <p> jest elementem blokowym, rozpycha się na szerokość, ale nie na wysokość, a ty nie nadajesz stylami żadnej wysokości, dlatego te elementy, które nie zawierają tekstu mają wysokość 0 i ich marginesy łączą się w jeden (to jest tzw. zapadanie się marginesów, czyli margin collapsing). Nadaj któremuś z pustych <p> jakąś wysokość, nawet 1px to zobaczysz, że wtedy odstęp między "tekst1" i "tekst2" powiększy się i to o więcej niż o 1px (o 16px dokładnie

).
Jeśli chcesz koniecznie robić odstępy pomiędzy paragrafami za pomocą pustych <p></p>zamień margin na padding, wtedy każdy pusty <p> będzie miał wysokość 30px. No a najlepiej po prostu odpowiednio ostyluj te <p></p> w których jest tekst a te puste wywal

Cytat
Pamiętaj też, że jak chcesz sobie zrobić odstęp to tego typu rozwiązanie z pustymi tagami nie jest dobre, i jak dobrze pamiętam przez validator w3c wypluje errora hm.
A dlaczego miałby wypluć błąd?

Walidator zobaczy 4 elementy blokowe jeden pod drugim, nic więcej - na pewno się do tego nie przyczepi