Pomoc - Szukaj - Użytkownicy - Kalendarz
Pełna wersja: [html][css] elementy się rozchodzą i są nierówno
Forum PHP.pl > Forum > Po stronie przeglądarki
Lejto
Mam problem z 2 listami które załączę na obrazkach i podam do nich kod. Elementy wyświetlają się nierównie i przyciski formularza są raz na dole, raz na górze. Nie wiem co już z tym zrobić.

  1. <form action="index.php?step=2" method="post">
  2.  
  3. <div style="width:750px; float:left;">
  4.  
  5. <div style="float:left; width:150px; height:200px; margin-top:20px;">
  6. <p>nazwa</p>
  7. <p style=""><input type="radio" name="drzwi" value="miniatury/asdas.png" />
  8. <img src="miniatury/asdas.png" /></p><p style="margin-left:50px; margin:0">asdas </p><p style="margin-left:; margin-top:0"> 23zł</p>
  9.  
  10. </div> <div style="float:left; width:150px; height:200px; margin-top:20px;">
  11. <p>nazwa</p>
  12. <p style=""><input type="radio" name="drzwi" value="miniatury/orzechaasd.jpeg" />
  13. <img src="miniatury/orzechaasd.jpeg" /></p><p style="margin-left:50px; margin:0">orzechaasd </p><p style="margin-left:; margin-top:0"> 123zł</p>
  14. </div> <div style="float:left; width:150px; height:200px; margin-top:20px;">
  15. <p>nazwa</p>
  16.  
  17. <p style=""><input type="radio" name="drzwi" value="miniatury/orzechaasdasd.jpeg" />
  18. <img src="miniatury/orzechaasdasd.jpeg" /></p><p style="margin-left:50px; margin:0">orzechaasdasd </p><p style="margin-left:; margin-top:0"> 213zł</p>
  19. </div> <div style="float:left; width:150px; height:200px; margin-top:20px;">
  20. <p>nazwa</p>
  21. <p style=""><input type="radio" name="drzwi" value="miniatury/asd.jpeg" />
  22. <img src="miniatury/asd.jpeg" /></p><p style="margin-left:50px; margin:0">asd </p><p style="margin-left:; margin-top:0"> 1233zł</p>
  23.  
  24. </div> <div style="float:left; width:150px; height:200px; margin-top:20px;">
  25. <p>Marek</p>
  26. <p style=""><input type="radio" name="drzwi" value="miniatury/marek.jpeg" />
  27. <img src="miniatury/marek.jpeg" /></p><p style="margin-left:50px; margin:0">marek </p><p style="margin-left:; margin-top:0"> 500zł</p>
  28. </div> <div style="float:left; width:150px; height:200px; margin-top:20px;">
  29. <p>Marek</p>
  30.  
  31. <p style=""><input type="radio" name="drzwi" value="miniatury/drzwimarek.jpeg" />
  32. <img src="miniatury/drzwimarek.jpeg" /></p><p style="margin-left:50px; margin:0">Drzwimarek </p><p style="margin-left:; margin-top:0"> 33zł</p>
  33. </div> <div style="float:left; width:150px; height:200px; margin-top:20px;">
  34. <p>Marek</p>
  35. <p style=""><input type="radio" name="drzwi" value="miniatury/testeror.jpeg" />
  36. <img src="miniatury/testeror.jpeg" /></p><p style="margin-left:50px; margin:0">testeror </p><p style="margin-left:; margin-top:0"> 233zł</p>
  37.  
  38. </div> <div style="float:left; width:150px; height:200px; margin-top:20px;">
  39. <p>Producent drzwi drewnianych</p>
  40. <p style=""><input type="radio" name="drzwi" value="miniatury/drzwidrewno.jpeg" />
  41. <img src="miniatury/drzwidrewno.jpeg" /></p><p style="margin-left:50px; margin:0">drzwidrewno </p><p style="margin-left:; margin-top:0"> 300zł</p>
  42. </div> <div style="float:left; width:150px; height:200px; margin-top:20px;">
  43. <p>Producent drzwi drewnianych</p>
  44.  
  45. <p style=""><input type="radio" name="drzwi" value="miniatury/testerek.jpeg" />
  46. <img src="miniatury/testerek.jpeg" /></p><p style="margin-left:50px; margin:0">testerek </p><p style="margin-left:; margin-top:0"> 100zł</p>
  47. </div>
  48. <input type="hidden" name="prod" value="" />
  49. <div style="float:left">
  50. <input type="submit" value="Dalej" />
  51. </div>
  52. </div>
  53. </form>



2 lista
  1. <div style="float:left; width:150px; height:200px; margin-top:20px;">
  2.  
  3. <p><input type="radio" name="kolor_r" value="wenge"><img src="obrazy/wenge.png"><p>wenge</p></p> </div> <div style="float:left; width:150px; height:200px; margin-top:20px;">
  4.  
  5. <p><input type="radio" name="kolor_r" value="wenge"><img src="obrazy/wenge.png"><p>wenge</p></p> </div><div style="margin-top:230px;">
  6.  
  7. <p style="">Futryna i kolory</p>
  8. <div style="float: left; width:200px;">
  9.  
  10. <p><input type="radio" name="futryna" value="miniatury/nazwa.jpeg" />
  11. <img src="miniatury/nazwa.jpeg" /></p><p>nazwa - 233zł</p>
  12. Kolor: <br />
  13. <div style="float:left; width:150px; height:200px; margin-top:20px;"> <input type="radio" name="kolor_rf" value="wenge"><img src="obrazy/wenge.png"><p>wenge</p></div></div> <div style="float: left; width:200px;">
  14.  
  15.  
  16. <p><input type="radio" name="futryna" value="miniatury/456.jpeg" />
  17. <img src="miniatury/456.jpeg" /></p><p>456 - 900zł</p>
  18. Kolor: <br />
  19. <div style="float:left; width:150px; height:200px; margin-top:20px;"> <input type="radio" name="kolor_rf" value="wenge"><img src="obrazy/wenge.png"><p>wenge</p></div></div> </div>
  20. <div style=" float:left; margin-top:200px;"><p>
  21. <input type="submit" value="Dalej" />
  22. </p></div>
  23.  
  24. </form>






Pozdrawiam

macie jakis pomysł?
Damonsson
Nie wiem jaką tam masz strukturę, ale do tego służy vertical-align.
Pokaż online to gdzieś. W firebugu minuta, a tak mi się nie chcę.
Lejto
http://hosting8840938.az.pl/Formularz/ z formularza wybierz drzwi płytowe
Niktoś
Wydaje mi się aby do p dodać minimalną wysokość.
Lejto
no dobra, ale co z przyciskiem formularza
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.