Pomoc - Szukaj - Użytkownicy - Kalendarz
Pełna wersja: [HTML]problem z pozycjonowaniem tabeli w IE
Forum PHP.pl > Forum > Przedszkole
-gojira-
12.08.2008, 09:21:05
Witam, zrobilem pewna strone i ktora dziala bezblednie na firefoxie. niestety nie dziala juz tak ladnie pod IE. mianowicie, znika pasek przewijania (po prawej strony z gory na dol) ktory jest widoczny w FF, a w IE nie moge pzrewinac strony w dol

[HTML] pobierz, plaintext 
  1. <table width="100%" height="100%" cellpadding="0" cellspacing="0">
[HTML] pobierz, plaintext


tak wyglada winowajca, gdyz kiedy wykasuje width i height, psaek pojawia sie i jest mozliwe przegladanie, ale psuje sie wyglad strony.

czy maci moze jakies rady jak temu zaradzic questionmark.gif
ferrero2
12.08.2008, 09:34:34
Przedewszystkim używaj CSS :

zamiast
Kod
<table width="100%" height="100%" cellpadding="0" cellspacing="0">


w ten sposób :
Kod
table {
width:100%;
height:100%;
}


Musisz pamiętać że tworzenie strony w procentach ma to do siebie że element wewnątrz którego coś środkujesz, określasz szerokości czy wysokości w procentach, musi mieć określoną szerokość czy długość właśnie w procentach. Inaczej taki rozmiar będzie ignorowany.
daj dla body width:100% a dla table width: 99% zobacz ja będzie wyglądać.

Jeśli nie to zapodaj kod strony może coś się pozmienia.

Pozdrawiam
pyro
12.08.2008, 09:43:00
przedewszystkim zapomnij o tabelach i zainteresuj sie divami
-gojira-
12.08.2008, 09:43:14
ok dzsieki wielkie, umieszczenie % w css pomoglo

pozdrawiam
-gojira-
12.08.2008, 09:48:45
Cytat(-gojira- @ 12.08.2008, 09:43:14 ) *
ok dzsieki wielkie, umieszczenie % w css pomoglo

pozdrawiam


eeeee jednak nie sorry... okazuje sie teraz ze jak jest wiecej elementow to dziala jak powinno, ale jak mam elementow wyswietlanych idealnie tyle ile ma stroa (wysokosc) to uciena mi wyswietlenie tego elementu i widze jego gorna polowe (np gorna polowa textu ktory wlasnie pisze)
ferrero2
12.08.2008, 10:05:10
Nie bardzo rozumiem - ale jeśli np strona ma 100% wysokości to nie możesz dać pierwszego elementu na 20 drugiego na 40 a trzeciego na 40 aby suma była 100. To nie jest takie proste jak się rzeczy robi nie chlujnie(bez urazy chodzi tutaj o to ze nie odgranicza się treści i kodu od części wizualnej) i nie zachowuje odpowiednich kolejności. Pamiętaj że na szerokość elementu czy na długość nie przypada tylko width.
Szerokość elementu to w kolejności: Margines zewnętrzny (margin) obramowanie(border) margines wewnętrzny(padding) i szerokość części tekstowej (width). Także dodając gdzieś przez przypadek border 2px do elementu któryma width 20 % to większasz jego szerokość zarówno w pionie jak i w poziomie o o 4px co powoduje rozjazd lub znikanie elementów.

Jeszcze raz polecam zapoznanie się z lekturą. www.gajdaw.pl - Układ oparty na divach (może to da Ci do myślenia że tabelka służy do danych tabelarycznych).

Pozdrawiam
Mariusz
-gojira-
12.08.2008, 10:50:08
no nie dalem tak jak mowisz ze strona ma 100% a ja jeszcze kolejne elementy daje wg schematu jaki podales. generalnie chodzi o to ze dodalem

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "DTD/xhtml1.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">

na strone teraz i IE juz mi nie ucina ostatniego wyswietlanego elementu, ale za to formatowanie sie popsulo w FF.
ferrero2
12.08.2008, 11:16:48
Daj kod strony. Tak to możemy sobie gadać.
Ja używam tylko tej pierwszej deklaracji DTD - która wymusza na IE zgodność z tym trybem (bardzo komfortowe rozwiązanie jeśli chodzi o wysokość bloków) bez tego jest tragedia pod IE.
Drugiej nie używam.
-gojira-
12.08.2008, 11:46:10
ehh nie moge edytowac jak jestem gosciem;/


//zrobione, ayeo


[HTML] pobierz, plaintext 
  1. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "DTD/xhtml1.dtd">
  2. <html xmlns="http://www.w3.org/1999/xhtml">
  3.  
  4. <head>
  5. <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
  6. <title>&nbsp;</title>
  7. <link href="styles.css" rel="stylesheet" type="text/css" />
  8.  
  9. <script type="text/javascript" src="swf_object.js"></script>
  10. </head>
  11. <body>
  12.  
  13. <table width="100%" height="100%" cellpadding="0" cellspacing="0">
  14.  
  15. <tr style="margin:0px; padding:0px; height:35px">
  16. 	<td style="margin:0px; padding:0px; height:35px">
  17. 		<table cellspacing="0" cellpadding="0" style="border-spacing:0">
  18. 			<tr>
  19. 				<td style="margin:0px; padding:0px; height:35px"><img src="/img/gradient_poziomy.gif" border="0" style="height:35px" /></td>
  20. 			</tr>
  21. 		</table>
  22. 	</td>
  23. </tr>
  24. <tr>
  25.  
  26. 	<td  height="20" style="vertical-align: middle; border: solid 1px #000; border-left-width: 0px; border-right-width: 0px; background-image: url(/img/gradient_pionowy.gif); background-repeat: repeat-x;" colspan="2">&nbsp;</td>
  27.  
  28. </tr> 
  29. 	<tr>
  30. 	<td style="width:100%; vertical-align:middle" height="100%">
  31. 		<center>
  32. 		<form action='' method='post' name='login'><table>
  33. 				<tr><td colspan='2'>&nbsp;</td></tr>
  34. 			</table><br><table>
  35. 			<tr>
  36.  
  37. 				<td>Login:</td>
  38. 				<td><input size=17 type='text' name='username'></td>
  39. 			</tr>
  40. 			<tr>
  41. 				<td>Hasło:</td>
  42. 				<td><input size=17 type='password' name='password'></td>
  43. 			</tr>	
  44. 			<tr>
  45.  
  46. 				<td colspan='2'>
  47. 				<input type='submit' name='submitLogin' value='Loguj'>
  48. 				</td>
  49. 			</tr>
  50. 		</table>
  51. 		</form>
  52. 		</center>
  53. 	</td>
  54. 	</tr>
  55.  
  56. </table>
  57. </body>
  58. </html>
[HTML] pobierz, plaintext


ale co w tym przypadki nie dziala formatowanie (np nie moge usunac marginesu)

fakt ze z tym odniesieniem do dtd IE dziala, ale FF sie wali
ferrero2
12.08.2008, 12:19:19
Oł maj gat smile.gif

Na początek dlaczego używasz styli wewnątrz tabelki skoro posiadasz odnośnik do style.css ?


Następnie :

1. Najpierw robisz formatowanie tabeli w htmlu potem drugą tabelkę w css-ie.
2. Stosujesz znacznik <center> więc nie sądzę aby margin:auto miało wpływ na układ.
3. Formularz nie ma żadnego formatowania (mówię o tym schemacie o którym pisałem margin border padding width)
4. Niektóre tabelki też nie mają żadnego formatowania.

Odpowiedz mi na jedno pytanie jakim cudem Ty tak naprawdę wiesz co ma jaką powierzchnię ?

Sposób sprawdzony i dobry : dodaj sobie do wszystkich elementów background i dla każdego ustal inny kolor - wtedy zobaczysz dokładny rozmiar jaki zajmują na stronie. (nie używaj border bo zwiększysz objętość)
Pisz stronę powoli - Najpierw wrzucasz tabelkę (patrzysz jaką część zajmuje) dodaje kolejne elementy i również ustalasz inne kontrastowe kolory (patrzysz jak się osadzają względem innych) i tak krok po kroku pozbędziesz się styli z pliku html jak również takich znaczników jak <center> grrr smile.gif

Pozdrawiam
-gojira-
12.08.2008, 12:40:44
tongue.gif no coz kubel zimnej wody ^^ ale dzieki za dobra rade, zabieram sie do pracy. dzieki za Twoj czas
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.