[HTML] DIV wstawia puste miejsce na stronie


(Abrimaal) #1

W moim serwisie www mam wiele zdjęć różnego autorstwa, dotychczas podpisywałem pod każdym zdjęciem, kto jest autorem,

teraz chciałbym używając

umieścić na zdjęciach numery, a pod spodem spis autorów fotografii.

Oto dwie strony, oryginalna i zmodyfikowana (z numeracją zdjęć):

http://araceum.abrimaal.pro-e.pl/alocasia/cuprea.htm

http://araceum.abrimaal.pro-e.pl/alocasia/cupreaa.htm

Różnią się od siebie tylko tym fragmentem kodu:

1

2

3

 photos ©[/code]

Nie wiem dlaczego każdy wstawiony

powoduje powstanie coraz większego odstępu między tabelą ze zdjęciami a dalszą częścią strony.

Gdy eksperymentalnie wstawiłem kilka więcej

, to każdy z nich powiększał ten odstęp.

Zamieniłem wszystkie

na , efekt był identyczny.

Czy istnieje możliwość ujęcia wszystkich numerów zdjęć w jednym

lub jakoś inaczej?

Dodam, że zacytowany fragment umieszczony jest zaraz pod tabelą ze zdjęciami, gdybym dał go na koniec strony, odstęp byłby na samym dole i by nie przeszkadzał, jednak pomimo, że każdy styl pisma zdefiniowany jest w pliku css, w różnych przeglądarkach numery mogłyby się przesuwać.


(floyd) #2

Użycie position:relative; powoduje takie dziwne efekty, zrezygnuj z niego.

Poczytaj o pozycjonowaniu, choćby tutaj:http://kurs.browsehappy.pl/CSS/Position


(adpawl) #3

Przez pozycjonowanie i nagłówki h3. Właściwie, to co one tam robią?

  1. weź zrób 3 identyfikatory i do nich przenieś te style

  2. wyrzuć h3 i bolda, a w stylach dodaj sobie formatowanie font-size, coor, font-weight czy co tam jeszcze chcesz

  3. pozycjonowanie to też inna sprawa - poczytaj trochę o pozycjonowaniu elementów

  4. aaa, i nie określasz żadnych wymiarów - czasem warto ustawić na sztywno szerokość/wysokość

  5. dlaczego to robisz poza tabelą? Wrzuć to w tabelę!

    foto1 div { ... }

    foto2 div { ... }

    foto3 div { ... }

1
[/code]


(floyd) #4

(Abrimaal) #5

Dzięki Wam za pomoc, sytuacja przedstawia się następująco:

Ostatnia propozycja

obraz.jpg


(floyd) #6

align="left">Veschort.gif


(Abrimaal) #7

Tak, to działa, ustawiałem obrazek jako tło strony w czasach kiedy wielu użytkowników korzystało z rozdzielczości 800x600 i żeby pokazać większe zdjęcie, na obrazku była ikona z lupą, zostało to jeszcze chyba tylko na tej stronie:

http://www.wschowa.com/abrimaal/araceum/philodendron/hederaceummicansp.htm

Umieszczając obrazki jako tło komórek tabeli, musiałyby być wszystkie jednakowych rozmiarów, co do pixela, w przeciwnym razie od prawej strony i od dołu (zob. foto 3) tło zaczyna się powtarzać, co nie wygląda zbyt ciekawie.

http://www.wschowa.com/abrimaal/araceum/alocasia/cupreaa.htm

Dodanie do stylu parametru "repeat:none" nic nie daje, być może umieszczam je w niewłaściwym miejscu albo nie dotyczy on tła. Przy kilkuset zdjęciach w serwisie, ponowne docinanie zdjęć aby pasowały jako tło zajęłoby lata i wymagałoby pisania prawie wszystkiego od nowa.

Gdyby dało się zrobić, żeby tło nie powtarzało się i było wycentrowane w komórce, to byłoby idealnie.

Jeszcze spytam o edytor www, rzeczywiście Pajączek nie obsługuje wielu dzisiejszych znaczników i trzeba dodawać ręcznie. Czy istnieje jakiś darmowy lub niedrogi edytor, który używa dzisiejszego standardu HTML? Może być po angielsku.

Kod tabeli w tej chwili wygląda tak

| 1  |
| 2  | 3  |

[/code]


(floyd) #8

Ja dałem obrazki w nowych tabelach, aTy w nowych kolumnach. Tabele mogą mieć różne wysokości, a kolumny w tabeli mają tę samą wysokość, nic więc dziwnego, że jak obrazek mniejszy to się powtarza. Powtarzanie można usunąć, ale nie będzie obrzaek wyśrodkowany w pionie.

Można towszystko zrobić chyba na dziesiątki sposobów. Mnie się wydawało, że lepiej jak obrazki będą z ramką, a nie tabelka. Tobie chyba lepiej pasuje jak tabelka jest z ramką ,a nie obrazki. Ja w takich wypadkach robię obrazki o tej samej wysokości i nie ma problemu. Tu jeszcze masz kilka rożnych możliwości.

Obrazki obramowane w tabelach.

|

| 1 |

|
|

| 2 |

|

| 3 |

|

[/code] Tabela obramowana obrazki nie.

| 
| 1 |
 |
| 
| 2 |
 | 
| 3 |
 |
Tabela z ramką, napisy w warstwach.
    
| |
1
2
3

(Abrimaal) #9

Widzę, że idziemy tą samą drogą :slight_smile:

Zależy mi na tym, gdybym miał modyfikować cały servis, żeby nie było za dużo męczenia się, jak przy obliczaniu pozycji.

Coś się wykombinuje. Na razie wielkie dzięki. =D>