Html / CSS obrazek robi dziwny odstęp

Dla specjalistów Webmastering
#1

Witam.

Robię stronkę HTML / CSS i jak wczytałem obrazek html , i pod nim jest odnośnik to obrazek nie wiem czemu zrobił mi taki duży odstęp (jak bym tam wstawił kilka razy br).Próbowałem dać w css pozycję top, middle dla obrazka ale to nie rozwiazało problemu.W html wybierałem vspace też nic nie dało aby chciałbym aby napis z linku był bliżej ów obrazka.

Z obrazowany problem > http://img130.imageshack.us/f/sakuw.png/

Plik pobierz.html

-/Pobierz sakuw-game:rozpierdowa/- ## -/Do poprawnego działania gry potrzebna biblioteka OpenGl/- pobierz.jpeg

SAKUW-GAME

[/code]

plik css

[code]a img {

border: none;

}

img.left {

float: left;

margin: 0 20px 0 0;

}

img.right {

float: right;

margin: 0 0 0 20px;

}

/*

img.top{

float: top;

margin: 10 10 0 210px;

}*/

Z góry dziękuję za pomoc

#2

Z tych kawałków kodu nie bardzo widać czemu tak się dzieje. Najlepiej sprawdzić jak interpretuje ten kod przeglądarka np Operą Dragonfly albo odpowiednikiem dla innych przeglądarek.

#3

Związku z tym dodaje więcej kodu, ten odpowiedzialny za wyswietlanei z tej części strony , oraz więcej css .

pobierz.html

Witaj na oficjalnej stronie SAKUW-GAME.

-/Pobierz sakuw-game:rozpierdowa/- ## -/Do poprawnego działania gry potrzebna biblioteka OpenGl/- pobierz.jpeg

SAKUW-GAME

OpenGl

*Gra udostępniona na wolnej licencji,pozwalam na bezpośrednie pobranie z mojej strony.

Nie udostepniam kodu źródłowego!*

[/code] Css

[code]h1, h2, h3 { margin-top: 0; } h1 { font-size: 1.6em; font-weight: normal; } h2 { font-size: 1.6em; } h3 { font-size: 1em; } h4 { font-size: 0.8em; } /* h5 { font-size: 0.5em; } */ ul { } a { text-decoration: none; color: #2C4449; } a:hover { border-bottom: none; } a img { border: none; } img.left { float: left; margin: 0 20px 0 0; } img.right { float: right; margin: 0 0 0 20px; } /* img.top{ float: top; margin: 10 10 0 210px; }*/ // #content { float: left; width: 460px; margin: 0px 20px 20px 20px; } .post { padding-bottom: 10px; line-height: 150%; border-bottom: 1px #2C4449 solid; } .post h1 { font-weight: normal; } .title { margin: 0; padding: 30px 0 4px 0px; font-size: 28px; font-weight: normal; } .title a { border-bottom: none; color: #FFFFFF; } .title a:hover { border-bottom: 1px dotted #000000; } .byline { margin: 5px 0px 10px 0px; padding: 2px 0px; font-family: Arial, Helvetica, sans-serif; font-size: 9px; color: #FFFFFF; } .tag { padding: 0 15px; } .entry { padding: 0px 0px; } .links { width: 80px; height: 33px; background: url(images/img05.jpg) no-repeat left top; text-align: right; font-weight: bold; } .links a { display: block; height: 25px; padding-top: 8px; padding-left: 10px; text-align: left; } .links a:hover { }

Mam nadzieję że tyle wystarczy,chodź chyba szybciej będzie wrzucić cały kod ?hm

edit://

nie używam opery, ani jej diagnostycznego syfu

stronka jest pod główne standardy więc powinna działać na wszystkich przeglądarkach dobrze, tabela po środku w której jest wszystko umieszczone uniknie rozwalenia strony,

bo bedzie dobrze na małym i dużym monitorze.Siedzę dziś 3 h i myślę nad tym odstępem i za licho nie wiem co sprawia ze on się pojawił ;/.to nie moja pierwsza strona, i nigdy tego nie miałem…

#4

Dodaj do obrazka display:block.

#5

Nic nie zmieniło ;x

Dodałem do wszystkich img’ to co podałeś i nic ;/

#6

Nie wiem jakie Ty znasz standardy ale chyba nie najnowsze (używasz stare tagi). Kolejność otwierania tagów i ich zamykania powinna być odwrotna. W pliku css wywal to //.

Po drugie odpaliłem to u siebie na ff i nie widzę jakiegoś większego odstępu KLIK.

#7

Czy na pewno wymiary tego obrazka są takie jak w tej linii napisałeś?

pobierz.jpeg

Dla sprawdzenia usuń width=“350” height=“345”

Według tych wymiarów pokazuje w miarę prawidłowo, a jeżeli w dalszym ciągu będzie źle to sprawdź jak wyświetla bez styli.

#8

to " // " dałem tu ; dla oddzielenia kodu którego nie podałem w moim pliku tego nie ma.

Wiem jakich znaczników używam, nie jest to przecież zabronione, a mnie ówcześnie tak w szkole uczą ;].

– Dodane 22.12.2010 (Śr) 13:09 –

#9

Nie mówię, że to zabronione :wink: ale lepiej ich unikać skoro css sobie radzi. Sprawdź stronę w walidatorze może masz niepozamykane tagi albo podaj tutaj cały kod html i css tej strony.

#10

  1. Nie napisałem żebyś użył Opery, tylko podał przykład narzędzia (nazwę) i za segurewałem użycie w jakiejkolwiek przeglądarce.

  2. Jeśli tworzysz storny i nie używasz więcej niż jednej przeglądarki… w sumie tu nie potrzeba komentarza.

  3. Odkąd używam ten “diagnostyczny syf” rozwiązanie problemu z wyglądem zajmuje mi nie więcej niż kwadrans.

To tyle do twojej merytorycznej odpowiedzi na moją poradę.

PS. Nie musisz tego komentować to mój ostatni post w tym temacie.

#11

piszę w notepad ++ i kolor składni wszędzie jest poprawny więc to nie wynik nie pozamykanych tagów.

@grzelix

oj foch

Jak widac nadal problem nie rozwiazy.

A jak chodzi o ściłość korzystam jeszcze z Navigator 9.0 , IE 7.0 / 9.0 Mozilla 4.0 beta 3 Chrome 6.0

Opery nie ;] Mam swoje powody by z niej nie korzystać

#12

Po pierwsze przeanalizują tę linię

OpenGl[/code]

i odpowiedź na pytanie czy jest to poprawny kawałek html?

Po drugie odstęp jest duży dlatego, że bezmyślnie korzystasz ze znaczników

i

.

Włącz myślenie, do czego służą znaczniki

i

, w jaki sposób domyślnie formatuje je przeglądarka.

I wszystko jasne :slight_smile:

#13

Ha.Zaskocze was.

problemem był obrazek ;/ zapisałem inny i nie ma problemu ;/

Dzięki wszystkim za pomoc.

I jak widać nie mieliście racji w sprawie H1 i BR ;]