[HTML]/[CSS] Strona "O mnie" - Allegro, U każdego inna Opcje

[Krystianek1]

Witam wszystkich serdecznie - mam do Was sprawę, może będziecie wiedzieć o co chodzi. Mam stronę o mnie na Allegro, tylko u każdego ona jakaś inna jest tzn. u mnie ona jest równa chodzi o górę - tam są trzy piony Gwarantujemy, Płatności, Komentarze - u jednego kolegi te Gwarantuje jest niżej, u drugiego Komentarze wyżej a Płatności i Komentarze na równi wiecie może co jest nie tak (IMG:http://forum.php.pl/style_emoticons/default/questionmark.gif) - grafik mi kazał usunąć parę znaków <br> usunołem, to u mnie wygląda to równo, tylko u innych nie :-(

KOD HTML Zamieszczę na stronie SendSpace, bo tutaj jak wkleję to za dużo znaków:

Kod HTML Strony "O mnie" - Allegro.

Kolega programista mi powiedział, że chyba ten grafik i niby programista sobie żartuje, mu ten KOD wcale nie przypomina strony o mnie - bym go się poradził o pomoc, lecz on nie ma czasu, sami wiecie praca, może ktoś z Was będzie mógł zerknąć na to okiem będę bardzo wdzięczny.

Pozdrawiam.

Ten post edytował Krystianek1 31.07.2007, 15:08:16

[phpion]

Daj lepiej linka do samego allegro.

[Krystianek1]

oki już podaję:

"O mnie"

i jak :/ (IMG:http://forum.php.pl/style_emoticons/default/questionmark.gif)

[Neojawor]

proponuję poczytać sobie o standardach HTML 4.01 - stron nie buduje się na tabelach - tabele służą do prezentowania danych tabelarycznych, a nie do formatowania wyglądu. Do wyglądu służy css, a jeśli Twoi koledzy informatycy/graficy Ci tego nie powiedzieli, to nie są programistami/grafikami. Sam jestem amatorem, ale takiego bałaganu w tagach HTML to bym nie wykombinował (przyznam że jak zaczynałem, to też takie coś robiłem).
Teraz będę trochę milszy (poniosło mnie, nie jest aż tak źle).
Sugeruję wywalić tabele i zastosować DIV-y. Będziesz miał 4 DIV-y - jeden to ten z banerem u góry, pozostałe trzy przypadają po jednym na kolumnę. Zastosuj takie style:

DIV {position: absolute;
width: 28%;
}
DIV.gora {position: static}
DIV.lewa {left:0;}
DIV.srodkowa{left:33%;}
DIV.prawa{right:0;}

pamiętaj żeby DIV klasy "gora" był jako pierwszy w kodzie HTML (to chyba ma znaczenie)

na koniec polecam 2 linki:
http://www.kurshtml.boo.pl/css/index.html - to taki mały podręcznik css-a
http://osiolki.net/tabelki/index.html - to coś, co KAŻDY web developer powinien przeczytać (nawet/zwłaszcza amator)

EDIT:
W związku z prośbą @Krystianek1 na PW troszkę dokładniej wyjaśnię (tolko zmień tag tytułu na HTML/CSS)

Sprawa ma się tak: HTML-a używamy do umieszczenia danych na stronie i semantycznego ich określenia (jeśli wstawiamy obrazek stosujemy <IMG>, jeśli cytat to <CITE>, a jeśli dane tabelaryczne to <TABLE>). Za wygląd ma odpowiadać CSS.
Z reguły definicję styli umieszcza się w osobnym pliku, lub ewentualnie w sekcji HEAD. Zrobimy to tym 2 sposobem, bo choć gorszy, to zadziała na 100%, w tym pierwszym musiałbyś plik *.css umieścić na osobnym serwerze, a to może nie zadziałać.

oto treść css-a:

[HTML] pobierz, plaintext 
<style type="text/css">
DIV  {position:absolute;}
DIV.gora {position:static;}
DIV.lewy {width: 29%; top: 300px; left:0; margin: 0 3px;}
DIV.srodek{width: 29%; top: 300px; left:33%; margin: 0 3px;}
DIV.prawy{width: 29%; top: 300px; right:0; margin: 0 3px;}
</style>
[HTML] pobierz, plaintext 

zaczynając tworzysz sobie obiekty blokowe, które będą zawierały całą Twoją stronę:

[HTML] pobierz, plaintext 
<DIVclass= "gora">tu będzie górna grafika</DIV>
<DIV class="lewy">tu wsadzisz zawartość kolumny lewej</DIV>
<DIV class="srodek">tu będzie kolumna środkowa</DIV>
<DIV class="prawy">a tu kolumna prawa</DIV>
[HTML] pobierz, plaintext 

ustalanie szerokości (width) zrobiłem na procentach, żeby osoby o rozdzielczości 800x600 mogły to też oglądać. Sprawdź jak ogląda się Twoją stronę teraz w małej rozdzielczości - allegro dostosowuje szerokość, a Twoja część jest na sztywno co powoduje, że nie da się tego czytać (zwłaszcza w Firefoxie).
Jeśli odstępy między kolumnami nie będą równe, to zmień ten wpis: left:33%; na wartość 34% - powinno pomóc, ja piszę z głowy i nie sprawdzam jak to wygląda.

Teraz widzę, że próbowałeś wstawiać sekcję HEAD, TITLE, i dodawać styl (<style type="text/css">) - wywal to i wywal znaczniki <BODY></BODY> - pamiętaj że działasz na otwartym organiźmie, Ty już jesteś w sekcji BODY, którą otwiera i zamyka samo Allegro.

Krótko skomentuję jeszcze lewą kolumnę:
1. Jeśli umieszczasz tekst w znaczniku LI, to po co jeszcze jakieś font-y, zamiast tego dodaj do części css-a to:

[HTML] pobierz, plaintext 
UL {font-family: Tahoma; font-size: 13px; line-height:13px; color: #B70000;}
[HTML] pobierz, plaintext 

jeśli się tekst nie podoba, to mieszasz w wartościach tych parametrów i możesz uzyskać prawie wszystko.
2. Tagów FONT, I, B, U się nie używa - są w HTML-u niewłaściwe, gdyż same formatują wygląd a nie określają co się w tym zawiera. Użyj <H3> - będziesz wiedział, że to nagłówek, użyj UL/LI - będziesz wiedział że to lista itp., ale nie używaj LI wszędzie. Jeśli akapit nie jest listą, to każdy z nich wsadź w znacznik <P></P> - będziesz wiedział że to akapit. Jeśli tekst w akapicie ma wyglądać tak jak w UL/LI, to do css-a dopisz:

[HTML] pobierz, plaintext 
UL, P {font-family: Tahoma; font-size: 13px; line-height:13px; color: #B70000;}
[HTML] pobierz, plaintext 

3. WYWAL WSZYSTKIE NIEłAMLIWE SPACJE - chcesz mieć odstęp od prawej krawędzi, to daj elementowi opakowującemu (tu DIV-owi):

[HTML] pobierz, plaintext 
DIV {margin-right:5px;}
[HTML] pobierz, plaintext 

Tak w zasadzie to trzeba by to co tam masz przepisać na nowo, tyle tam jest błędów. Teraz wypisałem tylko podstawy, ale stosując analogie powinieneś dać sobie radę. Dodam jeszcze że nie sprawdzałem tych kodó, więc nie daję 100% że wyświetli się tak jak powinno, ale jeśli jest coś źle to wymaga na pewno tylko niewielkich poprawek

pozdrawiam

Ten post edytował Neojawor 31.07.2007, 15:23:30

[Krystianek1]

dzieki wielkie, ale na allegro chyba divów nie można używać (IMG:http://forum.php.pl/style_emoticons/default/questionmark.gif) czy się mylę