Forum PHP.pl > [HTML/CSS]Denerwujący odstęp miedzy elementami <img />

Pomoc - Szukaj - Użytkownicy - Kalendarz

Pełna wersja: [HTML/CSS]Denerwujący odstęp miedzy elementami <img />

Zick4

5.01.2008, 23:57:24

Jak bez użycia tabel czyli samym CSS'em zrobić tak by obrazki były obok siebie bez denerwującej przerwy między nimi. Mój kod:

[HTML] pobierz, plaintext 
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" lang="pl" xml:lang="pl">
    <head>
        <title>WWW</title>    
        <meta http-equiv="Content-Type" content="text/xhtml; charset=iso-8859-2" />
        <meta http-equiv="content-language" content="pl" />
    </head>
    <body>
        <img src="1.jpg" />
        <img src="1.jpg" />
    </body>
</html>
[HTML] pobierz, plaintext

Wkurzyłem sie i ostatecznie spróbowałem tak ale i to nie pomogło:

[HTML] pobierz, plaintext 
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" lang="pl" xml:lang="pl">
    <head>
        <title>WWW</title>    
        <meta http-equiv="Content-Type" content="text/xhtml; charset=iso-8859-2" />
        <meta http-equiv="content-language" content="pl" />
    </head>
    <body style="padding: 0px">
        <img style="margin: 0px;" vspace="0" hspace="0" src="1.jpg" />
        <img style="margin: 0px;" vspace="0" hspace="0" src="1.jpg" />
    </body>
</html>
[HTML] pobierz, plaintext

qrees

6.01.2008, 00:03:17

Cytat(Zick4 @ 5.01.2008, 23:57:24 )

Jak bez użycia tabel czyli samym CSS'em zrobić tak by obrazki były obok siebie bez denerwującej przerwy między nimi. Mój kod:
(...)
Wkurzyłem sie i ostatecznie spróbowałem tak ale i to nie pomogło:
(...)

Ta przerwa to tak zwana spacja, wystarczy ją usunąć:

[HTML] pobierz, plaintext 
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" lang="pl" xml:lang="pl">
    <head>
        <title>WWW</title>    
        <meta http-equiv="Content-Type" content="text/xhtml; charset=iso-8859-2" />
        <meta http-equiv="content-language" content="pl" />
    </head>
    <body style="padding: 0px">
        <img style="margin: 0px;" vspace="0" hspace="0" src="1.jpg" /><img style="margin: 0px;" vspace="0" hspace="0" src="1.jpg" />
    </body>
</html>
[HTML] pobierz, plaintext

oggylwiatko

11.09.2008, 16:09:22

A w przypadku większej ilości obrazków można to samym css-em ustawić ? Próbowałem word-spacing: 0px i nie pomaga :/

decha-design

11.09.2008, 17:24:50

a nie prościej powielić 'rozwiązanie' @qrees'a dla wszystkich obrazków? nie można po prostu dać każdego obrazka przy sobie?

[HTML] pobierz, plaintext 
<img src="image.jpg" alt="" width="150" height="150" /><img src="image.jpg" alt="" width="150" height="150" /><img src="image.jpg" alt="" width="150" height="150" /><img src="image.jpg" alt="" width="150" height="150" /><img src="image.jpg" alt="" width="150" height="150" /><img src="image.jpg" alt="" width="150" height="150" /><img src="image.jpg" alt="" width="150" height="150" /><img src="image.jpg" alt="" width="150" height="150" /><img src="image.jpg" alt="" width="150" height="150" /><img src="image.jpg" alt="" width="150" height="150" />
[HTML] pobierz, plaintext

np. tak?

oggylwiatko

11.09.2008, 18:29:05

Tak brzydko wygląda kod:P
Ja zrobiłem tak że dałem każdemu obrazkowi display: block; oraz float: left;. IMHO jest to bardziej eleganckie rozwiązanie

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.