Odległość między wierszami tabeli HTML


(Tusiek1) #1

Witam

jestem nowy na forum, proszę o pomoc w sprawie odległości między wierszami tabeli chcę je zmniejszyć tylko nie wiem jak, tutaj kod html: http://wklej.se/96cf

chodzi mi o odstęp między obrazkami pionowo, proszę o pomoc i z góry dziękuje


(ziggurad) #2

To:

http://www.kurshtml.edu.pl/css/odstepy_ … abele.html

Albo padding w komórce.


(Tusiek1) #3

jak się robi pading? czy jest to możliwe w HTML?


(batmomobil) #4

Padding ustawia się w css http://www.w3schools.com/css/css_table.aspnajlepiej w css zewnętrznym.W head dajesz link i w komórce odwołujesz się po przez id.A tak poza nawiasem powinieneś mieć to na div-ach.


(Tusiek1) #5

A czy w HTML jest to możliwe zrobić?


(manieKMP) #6

Bezpośrednio do tagów można by dodać style=“padding: góra prawo dół lewo;”, ale to więcej roboty, bo musiałbyś do każdego tagu dla komórki to dodawać.

Jeśli jednak “upierasz się” lub musisz mieć to w pliku html, to dodaj do sekcji “head” (Przed jego zamknięciem) coś takiego:

Oczywiście jeśli chcesz by działało na wszystkie komórki…

PS. Z tego co zauważyłem, w kodzie już masz określane stylowanie css w tagach, ale tylko dla równania tekstu

, czyli musiałbyś do każdego z tych tagów dopisać padding.

Przykład:

(na górze i na dole 5 pikseli, z lewej i prawej 2 piksele).


(Tusiek1) #7

dalej to samo gdzie dokładnie to wpisać żeby było dobrze (o to dokładni mi chodzi http://pctr.pl/pics/a6106b498327572b242 … 8760a5.png )


(manieKMP) #8

Będę zgadywał, bo łatwiej byłoby stronę na żywo zobaczyć, ale możliwe że problem nie leży w padding, czy ogólnie w odległości między wierszami, a w tym że gdzieś w kodzie masz “błąd”, kodzie którego nie pokazałeś.

Odtworzyłem Twoją wklejkę w pliku html i u mnie się to tak wyświetliło:

Beztytu%C5%82u_png_300x300_q85.jpg

Zakładam więc, że masz gdzieś w innym miejscu określony parametr, który robi Tobie odstępy, ale gdzie się kryje ten się dowie jak zobaczy całość :wink: (może gdzieś w head masz “wstawkę” stylowania…)


(Tusiek1) #9

Proszę oto link a poniżej jest tabela i nie ma takich odstępów czy możliwe że tekst takie robi rzeczy?

http://tiny.pl/h2pf2

To jest ten kod z poprawnie wyświetlającą się tabelą, jest jakaś różnica między nimi?

| obrazek |

| |
| obrazek | obrazek |
| obrazek | obrazek |
| obrazek | obrazek |
| obrazek | obrazek | |

[/code]

|


(manieKMP) #10

No, teraz już wiadomo w czym problem (lepiej się to teraz czyta… ;)), a w zasadzie dwa problemy (wykonaj jeden lub oba według uznania):

  1. tag

należałoby usunąć

  1. tag

ma domyślną wartość marginesu górnego i dolnego ustawioną na 1em (czyli 16px), więc należałoby ją zmniejszyć np. ma 5px.

Do każdego tagu

należałoby dodać style=“margin: 5px 0;” (lub style=“margin: 0;” , jeśli zostawisz

):

…zawartość…

[/code]


(Tusiek1) #11

nie wiem zbytnio które to jest

ale gdy zmieniam

to schodzi mi do dolnej linijki

|

obrazek

|

obrazek

obrazek

obrazek

|

obrazek

| obrazek | obrazek | obrazek |
| obrazek | obrazek | obrazek | obrazek |[/code]


(manieKMP) #12

Tag

najwyraźniej wstawiany jest przez stronę (nie wiem w jaki sposób tworzona była tabela…), bo w jej kodzie te tagi zobaczyłem.

|

obrazek

|

obrazek

|

obrazek

|

obrazek

|
|

obrazek

|

obrazek

|

obrazek

|

obrazek

|
|

obrazek

|

obrazek

|

obrazek

|

obrazek

|[/code]

Powyższe jest wyciągnięte ze strony, z usuniętymi [i]

[/i], dodanymi marginesami do [i]

[/i] (wartości z poprzedniego postu) i są połączone dwie tabele w jedną…

Jeśli odległość dalej będzie duża, to będzie znaczyło, że strona z automatu dopisuje

do kodu, wtedy możesz spróbować zmniejszyć dodany margines z “5px” na “-10px”.


(Tusiek1) #13

dzięki wielkie działa :slight_smile: ale teraz pojawiła się bardzo duża przestrzeń nad tabelemi tu screen : http://pctr.pl/pics/287ce040298de586b88 … 2e586a.png

da się zniwelować


(manieKMP) #14

Hmm, wchodzę z linku, który podałeś i tego nie ma (w sumie to jest po staremu nawet)…

PS. Może przejdźmy na PW, bo się temat “rozlewa” :wink: