Style, så <p> står alene på linie!

Hej eksperter

Jeg har et menusystem, hvor jeg godt kunne tænke mig noget CSS, som sikrer at paragraffen kommer til at fylde en linie helt alene! På nuværende tidspunkt bliver nedenstående html-stump indsat øverst og nederst på siden. Jeg har så det problem at jeg et sted har et billede, som fylder så meget i højden, at den nederste menu er på højde med det nederste af billedet - jeg vil gerne have en modifikation af CSS-koden, så jeg er sikker på at menuen kommer til at stå alene på en linie - dvs. når billedet fylder så meget i højden, skal menuen automatisk flytte længere ned!


Jeg har følgende html-stump:

<p class="navigation"><span>Introduktion</span> | <a href="index.php?page=requirements" title="Systemkrav">Systemkrav</a> | <a href="index.php?page=install" title="Installation">Installation</a> | <a href="index.php?page=standard" title="Download standard TI Easy Search">Standard TIES</a> | <a href="index.php?page=custom" title="Download skræddersyet TI Easy Search">Skræddersyet TIES</a> | <a href="index.php?page=comments" title="Kommenter TI Easy Search">Kommenter TIES</a></p>

og følgende CSS-stump:

p.navigation {
        text-align: left;
}

p.navigation span {
    background-color:#CAD8FF;
}
   
p.navigation a:hover {
    color:#001C43;
    background-color:#99B3E7;
}