[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

[Ar2r]

Możesz wypróbować następujące rozwiązanie:
1. do #intro dodaj float: left;
2. jeśli będzie umieszczona jedna linia tekstu ustaw line-height na wysokość obrazka

[arczi82]

Jak widzisz w css mam ustawione tak jak mówisz, a jednak dalej coś nie gra, zerknij w linku i poklikaj.

Dziękuję za wszelaką pomoc.

[-m-]

kiedy zaglądam w źródło strony to widzę 2 x element DOCTYPE, 2 x sekcję HEAD (u samej góry i jakieś 10 cm niżej w sekcji BODY)

[arczi82]

Co do sekcji head, body, to już poprawiłem. problem byl w tym iż includuje pliki, które miały zdeklarowane body i head. Natomiast nadal nie poradziłem sobie z tym float: left

[Ar2r]

No dobra to teraz albo daj dla #intro width: 780px; albo .accordion h3 zamiast float: none; daj clear:left;

[arczi82]

Dzieki wielkie, "clear: left" pomogł, a jak ustawic teraz ten tekst aby był wysrodkowany i w pionie i w poziomie?

Pozdrawiam

[Maxik]

Może text-align i vertical-align?