Problem. Benötige hilfe!!!

Hey!
Als erstes möchte ich kurz loswerden das ich sowohl in der Webprogrammierung als auch hier im Forum neu bin. Daher wusste ich auch nicht ganz ob mein Problem mehr css oder html betrifft.
Ich habe mich an das erstellen einer Seite heran gewagt doch stehe ich nun vor einem Problem!
ICh möchte auf der rechten Seite des Designs eine Box einfügen (ebenfalls Transparent), die mit Kontaktdaten gefüllt werden soll. Habe schon alles möglich ausprobiert doch ich bekomme es nicht hin.
Hier die html:[HTML]

Menzel + Maurer GbR, Vermietung, Reparatur und Verkauf von Baumaschinen

<p...

design by jopasc.

[/HTML]
hier die css: [CODE]* {
margin: 0;
padding: 0;

}

body {
font-family: „Arial“ Verdana, Arial, Helvetica, sans-serif;
height: 300px;
font-size: 15px;
line-height: 17px;

background-image:url(images/bg.jpg);
background-repeat:no-repeat;

}

a {
text-decoration: none;
color: #F58220;
}
a:hover {
text-decoration: underline;
color: #111;
}

#wrap {
margin: 0 auto;
width: 900px;
}

#header {
margin-top:20px;
height: 120px;

}
#header h1 {
font-size: 28px;
letter-spacing: -1px;
padding: 10px 0 0 10px;
color: #FFF;
}

#header h2 {
font-size: 19px;
color: #000;
padding: 5px 0 0 10px;
letter-spacing: -1px;
font-weight: 100;
}

#menut {
filter:alpha(opacity=50);
-moz-opacity:0.6;
-khtml-opacity: 0.6;
opacity: 0.6;
height: 25px;
line-height: 25px;
background: #FFF;
margin-top: 0.5em;
}

#menu {
position:absolute;
top: 136px;
margin-top: 1em;
color: #000;

}
#menu ul {
list-style-type: none;
padding-left: 20px;
}
#menu ul li {
display: block;
float: left;
}
#menu ul li a {
padding: 0 20px 0 0;
text-decoration: none;
font-weight: 100;
font-size: 14px;
color: #000;
}
#menu ul li a:hover {
color: #fff;
text-decoration: none;
}

#content {
padding: 0 20px 20px 20px;
height: 400px;
background: #FFF;
filter:alpha(opacity=50);
-moz-opacity:0.3;
-khtml-opacity: 0.3;
opacity: 0.3;
margin-top: 0.5em;
margin-bottom:0.5em;
}

.left {
width: 700px;
position:absolute;
top: 228px;
padding-left: 3em;
color: #000;
}
.left h2 {
font-size: 18px;
font-weight: 100;
padding: 15px 0 7px 0;
}
.left h2 a {
text-decoration: none;
color: #FFF;
}

#footert {
filter:alpha(opacity=50);
-moz-opacity:0.6;
-khtml-opacity: 0.6;
opacity: 0.6;height: 25px;
line-height: 25px;
background-color: #FFF;
height: 25px;
}

#footer {
font-size: 11px;
color: #000;
position:absolute;
top: 611px;
padding-left: 35em;
}
[/CODE]

hier der link zur betreffenden Seite: Menzel + Maurer GbR, Vermietung, Reparatur und Verkauf von Baumaschinen

Ich hoffe ihr könnt mir helfen. Schonmal danke im Voraus

greezie Buntmetall

wo sind die Kontakt-Daten?

Am günstigsten ist es, die Elemente nebeneinander zu floaten. Websuche: „css tutorial float“

Minibeispiel:

[html]

<head>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
    <title>demo</title>
    <style type="text/css">

#wrapper {
width: 900px;
margin: 0 auto;
background: #f00;
}

#main {
width: 650px;
float: left;
background: #0f0;
}

#sidebar {
width: 200px;
float: left;
margin-left: 50px;
background: #00f;
}

#footer {
clear: both;
background: #ff0;
}

    </style>
</head>

<body>
    <div id="wrapper">
        <div id="main">#main</div>
        <div id="sidebar">#sidebar</div>
        <div id="footer">#footer</div>
    </div>
</body>
[/html]