Верстка - Страница 2

SuperSkat · 13.10.2008, 20:17

1.jpg, а надо чтобы не только под текстом был фон.

**MDM** · 13.10.2008, 20:37

Мы на месте топчемся. Ты так и не показал свой окончательный код.

Muskul · 13.10.2008, 22:08

SuperSkat, конечно, не видя кода, не совсем понятно, но, может, я в правильном направлении думаю:

Код HTML:

<html>
<style type=text/css>

.menu a:link, .menu a:visited, .menu a:active { 
	font-family: Georgia;
	font-weight: bold;
	font-size: 12px;
	text-decoration: none;  
	color: #74aee5;
	width: 200px;
	height: 200px;
	display: block;
}
.menu a:hover { 
	background: #ff0000;
}
</style>


<div class="menu"><a href="@">МЕД</a></div>
</html>

SuperSkat · 13.10.2008, 22:20

Ну что я вам скажу, господа, заработало =) Спасибо всем.

**MDM** · 13.10.2008, 22:32

Только внимательней. Размер ссылок теперь фиксированный. Текст может уйти за бордюры при увеличении его размера.

И все же код ты не показал.

Интересно было посмотреть, в каком месте косяк.

SuperSkat · 13.10.2008, 22:45

Код HTML:

.menu a:link, a:visited, a:active { 
	font-family: Georgia;
	font-weight: bold;
	font-size: 12px;
	text-decoration: none;  
	color: #74aee5;
}
.menu a:hover { 
	color: #ffffff;
	background: url(img/a.png) no-repeat;
}

Muskul · 17.11.2008, 14:05

Вопрос: как можно сделать динамически растягивающийся бэкграунд пунктов меню?
Допустим, так:
nav.gif

N0rd · 18.11.2008, 21:42

Muskul, почитай статейку, тут описан этот прием.

ДимON · 20.11.2008, 20:47

Существует валидатор http://www.jslint.com/ для javascript. Он ругается на функции типа document.write, alert, пишет, что они глобальные... А надо, чтобы скрипты мои прошли валидатор этот. Никто не знает, как можно решить проблемку? Буду очень благодаерен.

lourini · 27.10.2010, 18:18

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

SoaT · 27.10.2010, 18:58

lourini, UL, LI выранивать по горизонтали?

lourini · 27.10.2010, 19:25

SoaT, пробовал, не работает.. Когда гуглил, натыкался, что нужно возиться с css, но по делу ничего нет..

SoaT · 28.10.2010, 09:42

lourini,

Код:

ul li {
   float:left; /*горизонтальное выранивание*/
   list-style:none; /*чтобы небыло точек перед каждым LI*/
}

Добавлено через 43 секунды
тут к примеру: http://www.cssmaster.ru/Vyravnivanie...entru_stranicy

lourini · 28.10.2010, 14:40

SoaT, У меня плохие знание в html( Как правильно использовать css?

Код HTML:

<div>
   <ul>
<li><div style="text-align: justify;">
<script charset="windows-1251" src="http://vkontakte.ru/js/api/share.js?10" type="text/javascript">
</script> <script type="text/javascript">
<!--
document.write(VK.Share.button(false,{type: "button", text: "Сохранить"}));
-->
</script> </li>
<li><a href="http://www.facebook.com/sharer.php" name="fb_share" type="button_count">Опубликовать</a><script src="http://static.ak.fbcdn.net/connect.php/js/FB.Share" type="text/javascript">
</script> </li>

<li><a class="mrc__plugin_like_button" href="http://connect.mail.ru/share" rel="{'type' : 'button', 'width' : '200'}" target="_blank">Нравится</a> <script charset="UTF-8" src="http://cdn.connect.mail.ru/js/loader.js" type="text/javascript">
</script></li>

</li><a class="twitter-share-button" data-count="horizontal" data-via="krmoo" href="http://twitter.com/share">Tweet<qtlend></qtlend><qtlend></qtlend><qtlend></qtlend><qtlend></qtlend><qtlend></qtlend></a><script src="http://platform.twitter.com/widgets.js" type="text/javascript">
</script></div></li>
</div>

SuperSkat · 28.10.2010, 19:56

lourini, по идее вот так можно:

Код HTML:

<script charset="windows-1251" src="http://vkontakte.ru/js/api/share.js?10" type="text/javascript"></script>
<script src="http://platform.twitter.com/widgets.js" type="text/javascript"></script>
<script src="http://static.ak.fbcdn.net/connect.php/js/FB.Share" type="text/javascript"></script>
<script charset="UTF-8" src="http://cdn.connect.mail.ru/js/loader.js" type="text/javascript"></script>
<style>
div#soc_but {
	text-align: justify;
}
#soc_but ul li {
   float:left; /*горизонтальное выранивание*/
   list-style:none; /*чтобы небыло точек перед каждым LI*/
}
</style>
<div id="soc_but">
	<ul>
		<li>
			<script type="text/javascript">
				<!--
				document.write(VK.Share.button(false,{type: "button", text: "Сохранить"}));
				-->
			</script>
		</li>
		<li>
			<a href="http://www.facebook.com/sharer.php" name="fb_share" type="button_count">Опубликовать</a>
		</li>
		<li>
			<a class="mrc__plugin_like_button" href="http://connect.mail.ru/share" rel="{'type' : 'button', 'width' : '200'}" target="_blank">Нравится</a> 
		</li>
		<li>
			<a class="twitter-share-button" data-count="horizontal" data-via="krmoo" href="http://twitter.com/share">Tweet</a>
		</li>
	</ul>
</div>

только у меня кнопка мейла отвалилась.

Добавлено через 6 минут
А вообще, как-то бредовато выравнивать списком, проще запихать все в div и выравнять ссылки.

lourini · 30.10.2010, 15:53

SuperSkat, очень коряво получается всё в разнобой, можешь подробнее про div вариант?

dar · 30.10.2010, 18:31

Код HTML:

<style type="text/css">
.wapper {width: auto;} /* ширина родителя, можно в пикселях или процентах.*/
.wapper div {
   float: left;
   padding: 0 3px 0 3px; /* отступ внутри дива, поле так сказать, показетели: верх, право, низ, левый бок*/
   margin: 0 3px 0 3px;  /* отступ снаружи дива, ну и показатели: верх, право, низ, левый бок*/
}
</style>

<div class="wapper">
   <div>Элемент</div>
   <div>Элемент</div>
   <div>Элемент</div>
<div style="clear: both;"></div>
</div>

Вот так я делаю, внизу both - это ресет обтекания.
Нужно так же учитывать, чтобы Элементы по ширине подходили.

lourini · 31.10.2010, 13:52

dar, уже почти, только не корректно отражается вконтакте, и твиттер отпадает, что не так?
knop.png

Код HTML:

<style type="text/css">
.wapper {width: auto;}
.wapper div {float: left;
   padding: 0 2px 0 2px;
   margin: 0 2px 0 2px;}
</style>
<div class="wapper">
<div> <!-- Put this script tag to the <head> of your page -->
<script type="text/javascript" src="http://vkontakte.ru/js/api/share.js?10" charset="windows-1251"></script>

<!-- Put this script tag to the place, where the Share button will be -->
<script type="text/javascript"><!--
document.write(VK.Share.button(false,{type: "button", text: "Сохранить"}));
--></script> </div>
<div><a href="http://www.facebook.com/sharer.php" name="fb_share" type="button_count">Опубликовать</a><script src="http://static.ak.fbcdn.net/connect.php/js/FB.Share" type="text/javascript">
</script> </div>

<div><a class="mrc__plugin_like_button" href="http://connect.mail.ru/share" rel="{'type' : 'button', 'width' : '200'}" target="_blank">Нравится</a> <script charset="UTF-8" src="http://cdn.connect.mail.ru/js/loader.js" type="text/javascript"></script></div> <div><a class="twitter-share-button" data-count="horizontal" data-via="krmoo" href="http://twitter.com/share">Tweet</a><script src="http://platform.twitter.com/widgets.js" type="text/javascript">
</script></div>
<div style="clear: both;"></div>
</div>

dar · 31.10.2010, 14:45

lourini, стукни 483646561.

Про контакт, скорее всего там тоже div используется. Можно попробовать так:

Код HTML:

div.wapper {float: left;
   padding: 0 2px 0 2px;
   margin: 0 2px 0 2px;}

А по поводу твиттера надо глянуть на блог.
Кинь ссылку в аську мне, я буду курить - гляну где жуки зарылись, попробую их выкопать .

SuperSkat · 31.10.2010, 15:55

lourini, в стиле margin:0; сделай, должно помочь.

13.10.2008, 20:17	#21
SuperSkat Местный	1.jpg, а надо чтобы не только под текстом был фон. Последний раз редактировалось SuperSkat; 13.10.2008 в 20:27.

13.10.2008, 20:37	#22
MDM Администратор [BATTLE]TEAM	Мы на месте топчемся. Ты так и не показал свой окончательный код. __________________ [BATTLE]SERVER

13.10.2008, 22:08	#23
Muskul Заблокирован	SuperSkat, конечно, не видя кода, не совсем понятно, но, может, я в правильном направлении думаю: Код HTML: <html> <style type=text/css> .menu a:link, .menu a:visited, .menu a:active { font-family: Georgia; font-weight: bold; font-size: 12px; text-decoration: none; color: #74aee5; width: 200px; height: 200px; display: block; } .menu a:hover { background: #ff0000; } </style> <div class="menu"><a href="@">МЕД</a></div> </html> Последний раз редактировалось MDM; 13.10.2008 в 23:31. Причина: По просьбе автора.

13.10.2008, 22:20	#24
SuperSkat Местный	Ну что я вам скажу, господа, заработало =) Спасибо всем. __________________ wish you were here

13.10.2008, 22:32	#25
MDM Администратор [BATTLE]TEAM	Только внимательней. Размер ссылок теперь фиксированный. Текст может уйти за бордюры при увеличении его размера. И все же код ты не показал. Интересно было посмотреть, в каком месте косяк. __________________ [BATTLE]SERVER Последний раз редактировалось MDM; 13.10.2008 в 23:32. Причина: Умный больно.

17.11.2008, 14:05	#27
Muskul Заблокирован	Вопрос: как можно сделать динамически растягивающийся бэкграунд пунктов меню? Допустим, так: nav.gif

18.11.2008, 21:42	#28
N0rd Модератор [Epic] [Legion]	Muskul, почитай статейку, тут описан этот прием.

20.11.2008, 20:47	#29
ДимON Пользователь	Существует валидатор http://www.jslint.com/ для javascript. Он ругается на функции типа document.write, alert, пишет, что они глобальные... А надо, чтобы скрипты мои прошли валидатор этот. Никто не знает, как можно решить проблемку? Буду очень благодаерен. __________________ Чтобы удалить что-нибудь ненужное, надо сначала скачать что-нибудь ненужное, а у нас место на винте закончилось!

27.10.2010, 18:58	#31
SoaT Модератор	lourini, UL, LI выранивать по горизонтали? __________________ Wayland! Прочти: Прощание с мистером Икс / Мысли вслух о протоколе X Последний раз редактировалось SoaT; 27.10.2010 в 18:58.

27.10.2010, 19:25	#32
lourini Firefox User	SoaT, пробовал, не работает.. Когда гуглил, натыкался, что нужно возиться с css, но по делу ничего нет.. __________________ Veloextreme.com AndrewPtr twitter\| vkontakte\| facebook\| last.fm\| vimeo

28.10.2010, 09:42	#33
SoaT Модератор	lourini, Код: ul li { float:left; /горизонтальное выранивание/ list-style:none; /чтобы небыло точек перед каждым LI/ } Добавлено через 43 секунды тут к примеру: http://www.cssmaster.ru/Vyravnivanie...entru_stranicy __________________ Wayland! Прочти: Прощание с мистером Икс / Мысли вслух о протоколе X

30.10.2010, 15:53	#36
lourini Firefox User	SuperSkat, очень коряво получается всё в разнобой, можешь подробнее про div вариант? __________________ Veloextreme.com AndrewPtr twitter\| vkontakte\| facebook\| last.fm\| vimeo

31.10.2010, 14:45	#39
dar Chrome User	lourini, стукни 483646561. Про контакт, скорее всего там тоже div используется. Можно попробовать так: Код HTML: div.wapper {float: left; padding: 0 2px 0 2px; margin: 0 2px 0 2px;} А по поводу твиттера надо глянуть на блог. Кинь ссылку в аську мне, я буду курить - гляну где жуки зарылись, попробую их выкопать . __________________ Кто хочет - ищет способ, кто не хочет - ищет причину. СОКРАТ Последний раз редактировалось dar; 31.10.2010 в 14:54.

31.10.2010, 15:55	#40
SuperSkat Местный	lourini, в стиле margin:0; сделай, должно помочь. __________________ wish you were here

Здесь присутствуют: 1 (пользователей: 0 , гостей: 1)