[HTML][CSS][XML] Problem z opływaniem Opcje

[--arczi82--]

Witam mam następujący problem. Usiłuje opłynąć zdjęcie poprzez "float:" i o ile tekst opływa obraz to stronka się lekko rozpiepsza, nie stosuje hspace ani align przy którym wszystko działało, gdyż nie jest to zgodne ze specyfikacja xhtml strict, której użyłem.
Powyższy problem można zobaczyć tu
Zamierzonym celem jest wyśrodkowanie tekstu po prawej stronie obrazka.

Poniżej kod css

Kod

html {height: 100%; margin: 0; padding: 0; padding-bottom: 1px; }
body {
    background-image: url("img/bg.jpg");
    margin: 50px auto;
    width: 800px;
    font: 75%/120% Arial, Helvetica, sans-serif;
    color: #fff;
    overflow: auto;
}

.accordion {
    width: 780px;
    border-top: dotted 1px #fff;
    padding: 0px 0px;
   }

.accordion h3 {
    height: 15px;
    color: #e2e0e0;
    padding: 7px 15px;
    background-image: url("img/slider.png"); /*no-repeat right -51px;*/
    background-repeat: no-repeat;
    background-position: right;
    margin: 0px 0 0 0;
    font: bold 120%/100% Arial, Helvetica, sans-serif;
    /*border-top: dotted 2px #fff; */
    border-bottom: dotted 1px #fff;
    cursor: pointer;
       float: none;
}
.accordion h3:hover {
     margin: 0px 0 0 0;
     color: #fff;
     }

.accordion h3.active {
    background-position: right 5px;
    margin: 0px 0 0 0;
        border-bottom: dotted 1px #fff;
       color: #fff;
    float: none;
}    
.accordion div {
    margin: 10px 0 0 0;
    padding: 0px 15px 20px;
    border-bottom: none;
}


H4 {
Color: #e2e0e0;
}


#intro img {
float: left;
}

#galeria{
color: fff;
}

#footer {
margin-top: 280px;
padding-top: 10px;
border-top: dotted 1px #fff;
text-align: center;
}

Pozdrawiam

Powód edycji: Poprawiłem tytuł tematu. /webdicepl