Ustawienie pola <select> względem tekstu - css3

Myślałem, że znam podstawy CSS, ale wychodzi na to, że się myliłem…

Proszę o pomoc w ustawieniu pola SELECT względem tekstu aby wyglądało to tak jak na załączonym obrazku poniżej.

out.php?i=521843_poprawnie.png

Aktualnie wygląda to tak:

out.php?i=521844_niepoprawnie.png

Kod html:

Zainteresowania i doświadczenie
				

w dziedzinie IT (zaznacz wszystkie pasujące)

aplikacje internetowe 
bazy danych 
grafika komputerowa 
ochrona danych 
programowanie

CSS:

body{

	background-color: #F5F5F5;

}


fieldset{

	width:400px;

	border: 2px dotted currentcolor;

	border-radius: 8px;

	margin-bottom:20px;

}


p{

	text-align:left;

}


input{

	float:right;

	width: 220px;

}


select{

	float:right;

	display: inline;

}

Teraz chyba wyglądać będzie tak jak na obrazku.

(przeniesione zamknięcie “p”)

Zainteresowania i doświadczenie
            

w dziedzinie IT (zaznacz wszystkie pasujące)

aplikacje internetowe 
bazy danych 
grafika komputerowa 
ochrona danych 
programowanie

(coś dodane, coś zmienione… ;))

body{

       background-color: #F5F5F5;

    }


    fieldset{

       width:400px;

       border: 2px dotted currentcolor;

       border-radius: 8px;

       margin-bottom:20px;

    }


    p{

       float:left;

       width:150px;

    }


    input{

       float:right;

       width: 220px;

    }


    select{

       float:right;

       margin: 20px 0;

       width: 200px;

    }

A tak to wygląda: http://jsfiddle.net/d4UaC/

Ech… Nie ogarniam tego CSS’a

Twoje rozwiązanie działa bardzo fajnie :wink:

Dzięki.

Jeśli mógłbym prosić jeszcze tylko o pomoc w ułożeniu górnego

Tak wygląda html:

Dane identyfikacyjne

Nazwa użytkownika 

Hasło 

Potwierdź hasło 



Zainteresowania i doświadczenie
            

w dziedzinie IT (zaznacz wszystkie pasujące)

aplikacje internetowe 
bazy danych 
grafika komputerowa 
ochrona danych 
programowanie

CSS taki jak podałeś wcześniej:

body{

       background-color: #F5F5F5;

    }


    fieldset{

       width:400px;

       border: 2px dotted currentcolor;

       border-radius: 8px;

       margin-bottom:20px;

    }


    p{

       float:left;

       width:150px;

    }


    input{

       float:right;

       width: 220px;

    }


    select{

       float:right;

       margin: 20px 0;

       width: 200px;

    }

tak to wygląda:

out.php?i=521925_abc.png

Wynik do wglądu :wink:

Dane identyfikacyjne
Nazwa użytkownika

Hasło

Potwierdź hasło




Zainteresowania i doświadczenie         
w dziedzinie IT (zaznacz wszystkie pasujące)

aplikacje internetowe 
bazy danych 
grafika komputerowa 
ochrona danych 
programowanie 

[/code]

[code]body { background-color: #F5F5F5; } fieldset { width:400px; border: 2px dotted currentcolor; border-radius: 8px; margin-bottom:20px; } span { float:left; width:150px; } input, select { float:right; width:220px; } select, .special { margin:20px 0; } input, span { margin-bottom:8px; }