fesak: div layer nebeneinander

Beitrag lesen

Hallo!
Nachdem ich neulich ein Tutorial gelesen habe wie man Webseiten ohne Tabellen, mithilfe von css, erstellen kann hab ich mich gleich mal daran gemacht.
Ich habe einen zentrieren layer, dessen Hintergrund, das Logo und menü beinhaltet.
Auf diesen Hintergrund habe ich einen layer "navi" positioniert mit ein paar links. So jetzt möchte ich neben diesen layer einen weiteren setzen )"navi2") und noch einen link einfügen, jedoch lässt sich dieser layer partout nicht neben den anderen setzen.
hier der code:

!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Untitled Document</title>
<link href="style.css" rel="stylesheet" type="text/css" />
</head>

<body>
<div id="banner">
  <div id="navi">
    <p><a>text</a></p>
    <p><a href="banner.jpg" class="navi">link</a></p>
    <p><a href="banner.jpg" class="navi">link</a></p>
    <p><a href="banner.jpg" class="navi">link</a></p>
  </div>
  <div id="navi2">sollte rechts neben &quot;text&quot; erscheinen </div>
</div>
</body>
</html>

und hier die CSS:

/* CSS Document */
body {
 padding : 0;
 margin : 0;
 font-family: Verdana, Arial, Helvetica, sans-serif;
 font-size: 9px;
 }

p {
 margin: 4px;
 }

#banner {
 width: 811px;
 height: 100px;
 margin: 0 auto;
 background-image: url(banner.jpg);
 background-repeat: no-repeat;
    }

#navi {
 padding: 1px;
 width: 80px;
 height: 60px;
 position: relative;
 top: 19px;
 left: 12px;
 text-align: center;
 }

#navi2 {
 width: 30px;
 height: 10px;
 position: relative;
 top: 19px;
 left: 93px;
 text-align: left;
 }

.navi:link {color:#FFFFFF; text-decoration:none}
.navi:visited {color:#FFFFFF; text-decoration:none}
.navi:active {color:#FF9900; text-decoration:none}
.navi:hover {color:#FFCC66; text-decoration:none}

hier is der link zur seite:

http://home.arcor.de/fesak/html/

Ein weiteres kleines Problemchen wäre das die layer bei firefox und iexplorer immer um ein paar pixel unterschiedlich positioniert werden.
Also beim iexplorer rutscht der layer immer 2-3 pixel nach unten.

Bedanke für mich schonmal im vorraus für freundliche Hilfe.

mfg. ak