Pomoc - Szukaj - Użytkownicy - Kalendarz
Pełna wersja: tabelki css ;/ odpowiednia szerokosc
Forum PHP.pl > Forum > Po stronie przeglądarki
AZPR
7.02.2006, 16:28:07
mam "strone" html

[HTML] pobierz, plaintext 
  1. <html>
  2. <head>
  3. <title>asd</title>
  4. <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-2">
  5. <link rel="stylesheet" href="styl.css" type="text/css">
  6. </head>
  7.  
  8.  
  9. <p></p>
  10.  
  11. <table id="duza">
  12.  
  13.   <tr>
  14.     <td class="pasek">pasek</td>
  15.   </tr>
  16.   <tr>
  17.     <td class="slajd">slajd</td>
  18.     <td class="menu">menu</td>
  19.   </tr>
  20.   <tr>
  21.     <td height="118">zawartosc</td>
  22.   </tr>
  23.   <tr>
  24.     <td class="info">info</td>
  25.   </tr>
  26. </table>
  27.  
  28. </body>
  29. </html>
[HTML] pobierz, plaintext


oraz plik css:

[HTML] pobierz, plaintext 
  1. body {
  2. background: #FFFFFF;
  3. text-align: center;
  4. margin: auto;
  5. padding: 0;
  6.  
  7. }
  8.  
  9. table, td {
  10. padding: 0;
  11. margin:0;
  12. border: none;
  13. border-collapse: collapse;
  14. border-spacing: 0;
  15. }
  16.  
  17. * {
  18. font-family: verdana, tahoma, arial, sans-serif;
  19. color: #000000;
  20. font-size: 10px;
  21. }
  22.  
  23. /* glowna ramka */
  24.  
  25. #duza {
  26. width: 624px;
  27. height: 469px;
  28. border-left: 1px solid #c0c0c0;
  29. border-right: 1px solid #c0c0c0;
  30. border-bottom: 1px solid #c0c0c0;
  31. border-top: 1px solid #c0c0c0;
  32. text-align: left;
  33. margin-left: auto;
  34. margin-right: auto;
  35. vertical-align: top;
  36. border-collapse: collapse;
  37. border-spacing: 0;
  38. }
  39.  
  40. /* slajd*/
  41.  
  42. .slajd {
  43. width: 230px;
  44. height: 346px;
  45. background: url(img/menu.jpg) #FFFFFF;
  46.  
  47. }
  48.  
  49. /* menu */
  50.  
  51. .menu {
  52. width: 393px;
  53. height: 71px;
  54. background: url(img/menu.jpg) #FFFFFF;
  55.  
  56. }
  57.  
  58.  
  59. /* srodek glownej tabeli */
  60.  
  61.  .srodek {
  62. width: 624px;
  63. height: 346px;
  64. background: url(img/s1.jpg) #FFFFFF;
  65. }
  66.  
  67.  
  68. /* dolny pasek */
  69.  
  70.  .info {
  71. width: 624px;
  72. height: 105px;
  73. background: url(img/i1.jpg) #000000;
  74. }
[HTML] pobierz, plaintext


tylko ze jak przypisze clase do tableki to sie wszystko rozjerzdza ;/ nie wiem jak sobie z tym poradzic... ;/ a wszytko ma byc takiej wielkosci jak podalem w css ;/
gekon
7.02.2006, 20:23:08
Źle zbudowałeś tabelkę, powinna mieć tyle samo kolumn w każdym wierszu, możesz scalić komórki (powinieneś był tak zrobić):

[HTML] pobierz, plaintext 
  1. <table>
  2. <tr>
  3.  <td></td>
  4.  <td></td>
  5. </tr>
  6. <tr>
  7.  <td colspan="2"></td>
  8. </tr>
  9. </table>
[HTML] pobierz, plaintext


Dodatkowo, wysokość każdej komóki w tym samym wierszu powinna być taka sama, a szerokość wszystkich komórek w wierszu powinna być równa szerokości tabelki. Lepiej zrób to na divach smile.gif
Zajec
7.02.2006, 20:43:36
Dodatkowo to nie powinno się przypisywać sztywnej wysokości elementom, które posiadają tekst.

Co jeśli moja czczionka różni się od Twojej i tekst będzie za szeroki? Ano zrobią się dwie linie. Ale Twoje pola nie przewidują dwóch linii i część tesku mi się nie wyświetli.

Poza tym dodaj coś choćby tak podstawowego jak DOCTYPE i sprawdź stronę czasem validatorem (ctrl+alt+v w Operze).
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.