Разметка HTML (Нужна помощь)

10

vladik865

27 июля 2013, 16:39

683

Я не очень в этом разбираюсь, поэтому прошу если кто знает то подскажите код что бы поднять картинки на сайте вверх. Вот сайт - http://vladik865.pp.ua/333/ А вот на скрине видно что нужно сделать:

[ATTACH]126178[/ATTACH]

Вот код самой страницы:


<!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">

<head>

	<title>General</title>

	<meta http-equiv="content-type" content="text/html; charset=utf-8" />

	<meta name="keywords" content="Test web page vladik865" />

	<meta name="description" content="Test web page" />

	<!-- HEAD section -->

	<link rel="stylesheet" type="text/css" href="engine1/style.css" />

	<script type="text/javascript" src="engine1/jquery.js"></script>

	<!-- HEAD section -->

</head>

<body style="background-color:#FFFFFF">

	<!-- BODY section -->

	

<div class="logo"><img src="http://vladik865.pp.ua/333/banner_sceu.png" alt="" /></div>

	

<div class="ws_thumbs1">

<div> 

<a href="#" title="Описание"><img src="data1/tooltips/1.1.jpg" alt="" style="width:15.6%; height:73%;" /></a><a href="#" title="Описание"><img src="data1/tooltips/2.jpg" alt="" style="width:15.6%; height:36.5%;" /></a>

</ul><a href="#" title="Описание"><img src="data1/tooltips/3.jpg" alt="" style="width:13.5%; height:36.5%;" /></a>

<a href="#" title="Описание"><img src="data1/tooltips/4.jpg" alt="" style="width:15.6%; height:62%;" /></a>

<a href="#" title="Описание"><img src="data1/tooltips/5.jpg" alt="" style="width:40%; height:36.5%;" /></a>



</div>

</div>



<script type="text/javascript" src="engine1/swfobject.js"></script>



	<div class="ws_shadow"></div>

	

	

	<!-- BODY section -->

</body>

</html>

jpg 558789454545345435.jpg

473

eis

27 июля 2013, 16:50

#1

vladik865, самое простое и универсальное решение - каждой картинке добавить стиль и в правилах селектора прописать позициоирование с top: -n;

- Здесь я покупаю вечные ссылки на свои сайты! (https://backlinkator.com) - сотни ссылок за копейки

V8

10

vladik865

27 июля 2013, 16:54

#2

eis:
vladik865, самое простое и универсальное решение - каждой картинке добавить стиль и в правилах селектора прописать позициоирование с top: 100%;

А можешь код написать как именно, просто если я пишу такой код:


<div class="img1"><a href="#" title="Описание"><img src="data1/tooltips/1.1.jpg" alt="" style="width:15.6%; height:73%;" /></a></div>

То каждая картинка с новой строки идет...

31

ukrdev

27 июля 2013, 16:55

#3

- display:block; + float:left;

или

- display:inline-block; + vertical-align:top;

661

87793

27 июля 2013, 16:55

#4

eis:
самое простое и универсальное решение - каждой картинке добавить стиль и в правилах селектора прописать позициоирование с top: -n;

Ну, есть и другое решение, не менее простое и не менее универсальное: вывести блок рисунков таблицей, прописывая у каждой ячейки атрибут valign=top.

Наше дело правое - не мешать левому!

473

eis

27 июля 2013, 17:03

#5

vladik865, мин

---------- Добавлено 27.07.2013 в 20:06 ----------

Да, действительно. Решение ведь проще некуда - display: block; + float: left; для тега img внутри блока все будет позиционироваться по верхней границе.

---------- Добавлено 27.07.2013 в 20:09 ----------

Я что-то про воспринял img за div :)

Выровнить элементы по горизонтали Какой код Adsense правильный? Вопросы по веб-строительству от

V8

10

vladik865

27 июля 2013, 17:14

#6

eis:
vladik865, мин

---------- Добавлено 27.07.2013 в 20:06 ----------

Да, действительно. Решение ведь проще некуда - display: block; + float: left; для тега img внутри блока все будет позиционироваться по верхней границе.

---------- Добавлено 27.07.2013 в 20:09 ----------

Я что-то про воспринял img за div :)

Огромное спасибо!!! Все работает :)

---------- Добавлено 27.07.2013 в 21:32 ----------

А может еще подскажешь как дальше добавлять картинки что бы они шли с новой строки под первой каринкой, второй и т.д. ???? а то сейчас бардак получается((

Авто-клик по attachment в Nginx+php-fpm rewrite помогите решить Роспотребнадзор назвал Google главным

473

eis

27 июля 2013, 17:35

#7

vladik865, под первой строкой картинок надо создавать новый блок <div> в которой также добавлять картинки

V8

10

vladik865

27 июля 2013, 17:50

#8

eis:
vladik865, под первой строкой картинок надо создавать новый блок <div> в которой также добавлять картинки

Не помогает, все равно начинает строку со второй вытянутой картинки...

31

ukrdev

27 июля 2013, 18:17

#9

vladik865:
Не помогает, все равно начинает строку со второй вытянутой картинки...

для div - overflow:hidden;

V8

10

vladik865

27 июля 2013, 18:32

#10

ukrdev:
для div - overflow:hidden;

да в принципе помогло, но можно поднять картинки? так что бы они поднимались друг под друга и получалась как мозаика?

Маркетинг для шоколадной фабрики. На 34% выше средний чек

Дзен реализовал для авторов возможность вывода денег через СПБ