Problem z tabelą na różnych przeglądarkach


(Matriks87) #1

Witam wszystkich, jestem początkujący więc na początku proszę o wyrozumiałość i możliwie nie skomplikowaną pomoc!

problem dotyczy wyświetlenia pewnej tabeli na stronce którą tworzę, wszystko jest ok ale tylko na IE mam wersje 9, ale na mozili i operze tabelka się rozjerzdza:/ niech mi ktoś pomoże wybrnąć

tak ma wyglądać i wygląda w IE

a tak na operze i mozilli

a taki jest kod:

oferta.php

Podaj parametry budynku

| Podaj ilość pięter:   |   | |
| Podaj całkowitą ilość pomieszczeń:   |   | |
|   |   | |

[/code] style.css
[code] #all { width: 1040px; margin-left: auto; margin-right: auto; } body { background-image: url(obrazy/1.jpg); background-color: rgb( 120,232,130); background-attachment: fixed; text-align: center; } * { color: rgb(0,0,0); font-family: Trebuchet MS, Tahoma, Arial, sans-serif; } #formularz { width:100%; background-color: rgb( 144,255,200); text-align: left; table-layout:auto ; } .dane { text-align: right; border: 2px solid; } .pola { text-align: left; border: 1px solid; }


(Grzesie K) #2

Takich rzeczy nie robi się na table! Tutaj masz przykład jak to powinno wyglądać:

Ilość pięter:



Ilość pomieszczeń:

(Matriks87) #3

Dzięki śliczne, pomogło jest już prawie dobrze, jeszcze tylko dwie sprawy

tak wygląda na IE i operze

http://img857.imageshack.us/f/21150922.jpg/

tak na Moziolli

po pierwsze jak można ustawić "dodatkowe informacje " równo pod pozostałymi pozycjami

po drugie czemu na mozilli się trochę rozjeżdza?

label for="pietro">Podaj ilość pięter:




Podaj całkowitą ilość pomieszczeń:




Podaj ilość gniazd w pokojach:




Podaj ilość łazienek:




Podaj ilość kuchni:




Przewidziana ilość gniazd siłowych:




Podaj telefon kontaktowy:




Dodatkowe informacje:

label {

display:inline-block;

width:300px;

border:2px solid;

text-align:right;

margin-bottom:3px;

}

input {

text-align:left;

border: 1px solid;

}

(Grzesie K) #4

Mały zmiany w css

label {

display:inline-block;

width:300px;

border:2px solid;

text-align:right;

margin-bottom:3px;

vertical-align:top;

}

input,textarea {

text-align:left;

border: 1px solid;

width:200px;

}

textarea {

overflow:auto;

}

Przesunięcie w ponie było spowodowane wysokością textarea oraz domyślnym vertical-align, który wyrównał wszystko do dolnej linii. Natomiast przesuniecie w poziomie było spowodowane różną szerokość input i textarea. Teraz powinno być dobrze. :slight_smile:


(Matriks87) #5

no i jest ok, a jeszcze takie pytanie jak zmniejszyć sam przycisk wyślij? bo jest on wielkości innych inputów?


(Grzesie K) #6

nadaj mu class i dodaj css dotyczący tej klasy (width, height)