Pomoc - Szukaj - Użytkownicy - Kalendarz
Pełna wersja: [HTML][CSS] Formatowanie elementów formularza
Forum PHP.pl > Forum > Przedszkole
Rastman
witam,
mam taki kod:
  1. <tr>
  2. <td style="width:850px;color:white;" valign="bottom" colspan="4" height="146" background="images/cala4a.jpg">
  3.  
  4. <?php
  5. if(!isset($_SESSION['uzytkownik']))
  6. {
  7. echo(" <form method=\"POST\">");
  8. echo("&nbsp;&nbsp;&nbsp;Login:<input class=\"top\" type=\"text\">");
  9. echo("&nbsp;&nbsp;&nbsp;Hasło:<input class=\"top\" type=\"password\">");
  10. echo("&nbsp;&nbsp;&nbsp;<input type=\"image\" src=\"images/zaloguj.jpg\" style=\"margin-bottom:0px;\">");
  11. echo("&nbsp;&nbsp;&nbsp;<input type=\"image\" src=\"images/zarejestruj.jpg\" style=\"margin-bottom:0px;\">");
  12. echo(" </form>");
  13. }
  14. ?>
  15.  
  16.  
  17. </td>
  18. </tr>


znaczniki image formularza są na stronie wyświetlane wyżej niż znaczniki text i password. Jak należy sformatować style dla tych znaczników, aby wszystkie cztery znajdowały się w jednej linii?
krzysztof_kf
pokaż to najlepiej na obrazku przykładowym szybciiej się dogadamy
grassmen
A czego nie zrobisz tego w tabelce i wtedy pozycjonuj stylami margin- top margin-bottom
  1. echo("<form method=\"POST\">");
  2. echo("<table width="100%"> <tr>");
  3. echo("<td>&nbsp;&nbsp;&nbsp;Login:<input class=\"top\" type=\"text\"></td>");
  4. echo("<td>&nbsp;&nbsp;&nbsp;Hasło:<input class=\"top\" type=\"password\"></td>");
  5. echo("<td>&nbsp;&nbsp;&nbsp;<input type=\"image\" src=\"images/zaloguj.jpg\" style=\"margin-bottom:0px;\"></td>");
  6. echo("<td>&nbsp;&nbsp;&nbsp;<input type=\"image\" src=\"images/zarejestruj.jpg\" style=\"margin-bottom:0px;\"></td>");
  7. echo("</tr></table>");
  8. echo("</form>");


nie wiem czy zadział nie sprawdziłem ale przedstawiam jako pomysł ...
thek
Grassmen... Nie używa się tabelek do układania layoutu. To już technika wskazująca na brak umiejętności webmastera :)By były w jednej linii wystarczy dać float:left elementom i same się jeden obok drugiego ustawią.
grassmen
Thek ..... zaproponowałem rozwiązanie ... nie wydaje mi się żeby mówiło one o braku moich umiejętności ... jest sposobem rozwiązania pytania które zostało zadane w temacie jak rozwiąże to sobie Rastman jego sprawa ! jest to jakiś sposób może nie do końca ładny i teraz już modny ale jest ... pozdr
thek
A czy ja wspominałem, że świadczą konkretnie o Twoim? Jedynie tyle, że strona zbudowana za ich pomocą wskazuje na to, iż autor strony nie potrafi zrobić jej inaczej, a więc ma braki w stosowaniu nowocześniejszych rozwiązań. Tabelki stosuje się nadal ale mają one zgodnie z przeznaczeniem wyświetlać dane tabelaryczne, nie zaś służyć do cięcia layoutu na bloki funkcjonalne. Poza tym porównaj zgrabność kodu opartego na float z wrzuceniem wszystkiego do osobnych komórek tabeli. Ogrom nadmiarowego kodu tylko przy stosowaniu tabeli, na dodatek nieskalowalny w przyszłości i wiążący się z całkowitą przebudową tego fragmentu. Niefajne i czasochłonne. A wiesz jak to jest... "Czym skorupka za młodu nasiąknie..." lepiej nie uczyć takich rozwiązań młodych i nie wspominać, że kiedykolwiek istniały, albo wręcz mówić, że to fatalny sposób, którego nie powinno się używać.
Rastman
ja chcę się tylko dowiedzieć jak w 1 kolumnie tabeli ustawić input i image w taki sposób, żeby stały idealnie w jednej linii
thek
Powiem tak... Robiąc to w sposób z tabelką i jedną kolumną w sposób jaki prezentujesz swoim kodem, nie uzyskasz tego efektu nigdy smile.gif Na każdej przeglądarce będzie to bowiem inaczej wyglądać. Da się to ostylować, ale wiąże się to z albo dwoma kolumnami tabeli, albo wrzuceniem tekstu będącego przed inputem w jakiś element z nadaną stałą szerokością (gdy ma to być równo w kolumnie). Jeśli ma to jednak być w jednej linii to tekst kładziesz do elementów i zarówno im, jaki i inputom nadajesz atrybut float:left.
To jest wersja lo-fi głównej zawartości. Aby zobaczyć pełną wersję z większą zawartością, obrazkami i formatowaniem proszę kliknij tutaj.
Invision Power Board © 2001-2025 Invision Power Services, Inc.