Pomoc - Szukaj - Użytkownicy - Kalendarz
Pełna wersja: [HTML] Odstępy miedzy obrazkami
Forum PHP.pl > Forum > Przedszkole
Arsanael
27.08.2009, 03:25:58
Witam, nie wiem czemu ale gdy chce umiescic obrazek pod obrazkiem w pionie nie moge tego zrobić gdyż są centymetrowe odstepy miedzy nimi, nie wiem na czym polega błąd. Oto kod:

[HTML] pobierz, plaintext 
  1. <td valign="top" width="175" align="center" background="/images/center.PNG">
  2. <center>
  3. <img src="/images/up.PNG">
  4. <br />
  5. <font size="2"><b>Witaj Nieznajomy!</b>
  6. <br/>
  7. [ Rejestracja ]
  8. <br />
  9. [ Logowanie ]
  10. </font>
  11. </center>
  12.  
  13. <img src="/images/down.PNG" border="0">
  14. <img src="/images/tlo.PNG" border="0">
  15. <img src="/images/tlo.PNG" border="0">
  16.  
  17. </td>
[HTML] pobierz, plaintext



z gory dziekuje.
ayeo
27.08.2009, 03:58:50
Witam!

Wyzeruj marginesy (img {margin: 0;})

Pozdrawiam!
Arsanael
28.08.2009, 00:58:02
Hmm, mozna proscic o jakis kod przykładowy uzycia tego ? byłbym wdzieczny smile.gif
bmL
28.08.2009, 01:16:06
Jeżeli dobrze pamiętam to powinno pomóc:
[HTML] pobierz, plaintext 
  1. <style type="text/css">
  2. img {
  3. display: inline;
  4. }
  5. </style>
[HTML] pobierz, plaintext
Arsanael
28.08.2009, 02:10:39
nie zabardzo ma ochote zadziałać ale możliwe ze przez to iż moja wiedza o CSS'ie jest znikoma. 
[HTML] pobierz, plaintext 
  1. <head>
  2.  
  3.       <style type="text/css">
  4.       img {
  5. display: inline;
  6.       margin: 0;
  7. }
  8.  
  9.       </style>
  10. </head>
[HTML] pobierz, plaintext


skorygujcie jeśli źle .
f1xer
28.08.2009, 02:14:47
a możesz rzucić link do stronki?
varez
28.08.2009, 07:08:21
jak masz firefoxa to sciag dodatek FireBug,
jak masz opere to Narzędzia -> Zaawansowane -> Narzędzia dla deweloperów.
Tam podgladniesz jakie style aktualnie ma obrazek, i skąd się wzięły smile.gif
http://i30.tinypic.com/35b5b2o.jpg
nitek
28.08.2009, 10:13:34
Spróbuj tak, jak radził Ci ayeo, czyli:

[HTML] pobierz, plaintext 
  1. <style type="text/css">
  2. img {
  3.  border:0 none;
  4.  margin:0px;
  5.  padding:0px;
  6. }
  7. </style>
[HTML] pobierz, plaintext


Te style umieść gdzieś pomiędzy <head> a </head>
bmL
28.08.2009, 23:18:58
Pomyliłem się i to głupio przecież img standardowo jest elementem liniowym fix o który mi chodziło to :
[HTML] pobierz, plaintext 
  1. <style type="text/css">
  2. img {
  3. display: block;
  4. }
  5. </style>
[HTML] pobierz, plaintext

Fix ten naprawia pionowy odstęp między obrazkami w IE. Inaczej ten odstęp daje się jedynie usunąć przez ujemny margines połączony z !important
Arsanael
29.08.2009, 15:26:28
dalej nie idze ;/

zarzuce screena :



Te białe paski to są obrazki właśnie które chciałbym zeby były połączone.
Puki co nic nie działa ;/
TheaSiX
29.08.2009, 16:31:16
wrzuć w tabele i wyzeruj cellpadding i cellspacing albo wypozycjonuj absolutnie
thek
29.08.2009, 17:08:33
Zrób tak jak radzą koledzy. Wyzeruj marginesy i paddingi. Domyślnie przeglądarki elementom mogą nadawać jakieś wartości różne od 0 a niechlubnym przykładem takiej bardzo częstej praktyki pod tym względem jest IE. Choć nie tylko mu się to zdarza.
Arsanael
29.08.2009, 17:09:33
cellpadding cellspacing mam ustawone na 0

Cytat
wypozycjonuj absolutnie


tzn ?

daje cały kod tabeli:


[HTML] pobierz, plaintext 
  1. <table width="850" height="269" bgcolor="#EDEEE8" align="center" border="0" cellpadding="0" cellspacing="0">
  2.  
  3. <tr height="269" cellpadding="0" cellspacing="0">
  4.  
  5. <td valign="top" width="175" align="center" background="/images/center.PNG" cellpadding="0" cellspacing="0">
  6. <center>
  7. <img src="/images/up.PNG">
  8. <br />
  9. <font size="2"><b>Witaj Nieznajomy!</b>
  10. <br/>
  11. [ Rejestracja ]
  12. <br />
  13. [ Logowanie ]
  14. </font>
  15. </center>
  16.  
  17. <img src="/images/down.PNG" border="0">
  18. <img src="/images/tlo.PNG" border="0">//te 2 obrazki nie chca sie łaczyc ;/
  19. <img src="/images/tlo.PNG" border="0">//te 2 obrazki nie chca sie łaczyc ;/
  20.  
  21. </td>
  22.  
  23. <td valign="top" width="475">
  24. <br>
  25. <font size="4"><b>Postacie</b></font> 
  26. <hr>
  27. <font size="2">
  28.  
  29. <img src="images/site_web_images/foreman.jpeg">
  30.  
  31.  
  32. <hr>
  33.  
  34. </font>
  35. </td>
  36.  
  37. <td valign="top" width="200" height="500" background="/images/table1v1.PNG">
  38. <center> 
  39. <iframe width="160" height="175" src="shoutbox.php" FRAMEBORDER="0"></iframe>
  40. <font size="2"><b> Wiadomosć :</b></font>
  41. <br/>
  42. <form action="add_shout.php" method="post">
  43. 	<input type="text" name="add" style="background-color: #E2E7CB; font-size: 8pt; font-weight: bold; width: 150px; height: 15px; border-style: solid; border-color: #C1C6A7" />
  44. <input type="submit" value="Wyslij" />
  45. </form>
  46.  
  47.  
  48. </center>
  49. </td>
  50.  
  51. </tr>
  52.  
  53.  
  54. </table>
[HTML] pobierz, plaintext
thek
29.08.2009, 18:08:59
Layout na tabelkach.... WRRRR winksmiley.jpg

A tak w temacie... Patrząc na screeny widzę, że powyżej panelu logowania masz także te paski, więc czemu nie pomyślałeś, by jako tło tej komórki ustawić tlo.png mające repeat-y? winksmiley.jpg
Arsanael
29.08.2009, 20:46:36
tlo to są paski poprzeczne tej jakby tabelki a obrazkami są oprócz tego co wam mówiłem to zakonczenia ramek panelu logowania (te łuki donly i górny) no i własnie jest też problem z tym bo obrazek górny nie chce dochodzic do góry tabeli tylko jest troche niżej psując efekt ;/

Jakieś rady ?
Przepisanie tego an CSS by coś dało ?
Juz nie wiem co mam robić nic nie działa zaden sposób. ;/
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.