CSS дизайн

[rinx 0]

Давайте посмотрим на вот эти сайты: http://cssblast.ru/gallery/

там все представленные сайты сверстаны блочно и все валидны. А то что mail.ru и лебедев не валидны то конечно это им скорей минус, а не плюс!

Что касается верстки то блоки они для этого и нужны, а вот когда целую кучу таблиц делают в таблице =)

Да и выглядит помоему круче чем таблица. Загрузка тоже =)

Для интереса решил глянуть ошибки http://www.sensauto.ru/

Все ошибки вызваны тегом:

Error: <noindex> is not recognized!

По этому поводу валидатор пишет: If it is not intended, remove the tag.

Помоему их код можно считать валидным =)

[anton 0]

Да не нужно в таблице делать кучу таблиц, для этого css как раз и нужен, валидность - ну это настолько относительно, скорость загрузки - ну смешно рассуждать об этом, 8 лет назад еще было актуально, но не сейчас, вон некоторые умудряются на flash целиком сайты делать, так вес 2 - 4 метра и что - хорошие бабки имеют, так что скорость загрузки в разнице 5 - 15 кб это просто смешно, поэтому наилучший вариант - таблицы + дивы, вообще - каждый верстает так как считает нужным, ни табличная ни дивная верстка не имеют существенных ни плюсов не минусов для конечного пользователя, ему, по большому счету до фени пени , естественно если это сделано граммотно

[FeaR 0]

то бы не создовать тему новую как сделать что бы таблица например:

<table width="100%">

	<tr>

		<td width="5"><img src="{THEME}/images/ltdt.png" width="5" height="50" border="0"></td>

		<td background="{THEME}/images/bgtdt.png" class="ltitle" valign="top">Вход на сайт</td>

		<td width="5"><img src="{THEME}/images/rtdt.png" width="5" height="50" border="0"></td>

	</tr>

	<tr>

		<td background="{THEME}/images/ltd.gif"><img src="{THEME}/images/ltd.gif" width="5" border="0"></td>

		<td class="copy">{login}</td>

		<td background="{THEME}/images/rtd.gif"><img src="{THEME}/images/rtd.gif" width="5" border="0"></td>

	</tr>

	<tr>

		<td><img src="{THEME}/images/ltdb.png" width="5" height="10" border="0"></td>

		<td background="{THEME}/images/tdbbg.png"><img src="{THEME}/images/tdbbg.png" width="1" height="10" border="0"></td>

		<td><img src="{THEME}/images/rtdb.png" width="5" height="10" border="0"></td>

	</tr>

</table>

как сделать что бы она была справа и слева?Т.е что бы было 3 таблицы по горизонтали.

[lifestar 18]

<table width="30%" style="float:left">

[Kaiser 2]

http://validator.w3.org/check?uri=www.artl...;doctype=Inline

Себя уже восхвалили!

http://validator.w3.org/check?uri=http%3A%...;doctype=Inline

Даже у гиганта microsoft.com 9 ошибок (http://validator.w3.org/check?uri=www.micr...;doctype=Inline), а у гугля 51 (http://validator.w3.org/check?uri=www.goog...;doctype=Inline)

[FeaR 0]

Спасибо!Но это сдвиг таблицы в влево а мне надо что бы было например навигация по сайту потом новости потом опрос например,как сделать так?

[lifestar 18]

какой нафиг сдвиг?

<table width="33%" style="float:left">

...

</table>

<table width="33%" style="float:left">

...

</table>

<table width="33%" style="clear:right">

...

</table>[/html]

А не проще ли вам это DIVами делать, или если таблицей, то 3-мя колонками 1-й таблицы??

[FeaR 0]

вот как сделать так?

[anton 0]

Если таблицей то так (только значения какие нужно поставьте), ну а дальше уже css подключайте для позиционирования элементов внутри таблицы, текста и тд

<table width="100%" border="0" cellspacing="0" cellpadding="0">

  <tr> 

	<td colspan="3">Шапка</td>

  </tr>

  <tr> 

	<td width="250">Правая колонка</td>

	<td>Контент</td>

	<td width="250">Левая колонка</td>

  </tr>

  <tr> 

	<td colspan="3">Футер</td>

  </tr>

</table>

Это вам просто пример 3х колоночной таблицы

[lifestar 18]

Вот наконец нарисовал свой первый сайт полностью на DIVах..

Правда заглядывая в мануал, но всё же...

http://cliplib.ru

Сиё не есть реклама и вообще это не DLE

[FeaR 0]

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

покажите на примере

<table width="100%">

<tr>

<td width="5"><img src="{THEME}/images/ltdt.png" width="5" height="50" border="0"></td>

<td background="{THEME}/images/bgtdt.png" class="ltitle" valign="top">Вход на сайт</td>

<td width="5"><img src="{THEME}/images/rtdt.png" width="5" height="50" border="0"></td>

</tr>

<tr>

<td background="{THEME}/images/ltd.gif"><img src="{THEME}/images/ltd.gif" width="5" border="0"></td>

<td class="copy">{login}</td>

<td background="{THEME}/images/rtd.gif"><img src="{THEME}/images/rtd.gif" width="5" border="0"></td>

</tr>

<tr>

<td><img src="{THEME}/images/ltdb.png" width="5" height="10" border="0"></td>

<td background="{THEME}/images/tdbbg.png"><img src="{THEME}/images/tdbbg.png" width="1" height="10" border="0"></td>

<td><img src="{THEME}/images/rtdb.png" width="5" height="10" border="0"></td>

</tr>

</table>

[LelikInside 0]

<!--верхняя панелька, отступ-->

<div>  

  <table width="100%" border="0">

	<tr>

	 <td width="15" align="left"><img src="{THEME}/images/spacer.gif" width="1" height="10" /></td>

	</tr>

  </table>

</div>


<!--левая панелька, отступ-->

<div align="center">

  <table width="2%" border="0" cellspacing="0" cellpadding="0">

  </table>

</div>  


<div align="center">

<table width="96%">

<tr>

<td width="5"><img src="{THEME}/images/ltdt.png" width="5" height="50" border="0"></td>

<td background="{THEME}/images/bgtdt.png" class="ltitle" valign="top">Вход на сайт</td>

<td width="5"><img src="{THEME}/images/rtdt.png" width="5" height="50" border="0"></td>

</tr>

<tr>

<td background="{THEME}/images/ltd.gif"><img src="{THEME}/images/ltd.gif" width="5" border="0"></td>

<td class="copy">{login}</td>

<td background="{THEME}/images/rtd.gif"><img src="{THEME}/images/rtd.gif" width="5" border="0"></td>

</tr>

<tr>

<td><img src="{THEME}/images/ltdb.png" width="5" height="10" border="0"></td>

<td background="{THEME}/images/tdbbg.png"><img src="{THEME}/images/tdbbg.png" width="1" height="10" border="0"></td>

<td><img src="{THEME}/images/rtdb.png" width="5" height="10" border="0"></td>

</tr>

</table>

</div>


<!--правая панелька, отступ-->

<div align="center">

  <table width="2%" border="0" cellspacing="0" cellpadding="0">

  </table>

</div>  

[FeaR 0]

А по другому можно как нибудь?

[RED 1]

Здравствуйте уважаемый Lifestar. Помогите пожалуйста разобраться в css. Никак не могу понять раздел таблицы. Либо таблицу можно прописать полностью на css и просто классом вывести, либо вместе с html только и в css задаются только свойства. Этого не понял. Все остальное осилил и понятно а вот таблицы никак что-то и примеры не понимаю. Везде в руководствах вроде бы вместе c html, но на одном сайте увидел наоборот вот и не могу разобраться. Помогите.

Спасибо.

[lifestar 18]

RED, я совершенно не понял что вы имели в виду. Расскажите более доступным языком, лучше в примерами

[RED 1]

в том-то и дело я сам примеры таблиц на css не понимаю. Вопрос был в том можно ли в css сделать таблицу вида

<table border="1">

<tr>

<td>&nbsp;</td>

</tr>

</table>

и если да то как сделать, если можно то напишите пример

[lifestar 18]

я сам примеры таблиц на css не понимаю

Что это такое вообще?

И если не понимаете зачем вам это нужно?

[RED 1]

Нужно чтобы код оптимизировать

[lifestar 18]

<table border="1">

<tr>

<td>&nbsp;</td>

</tr>

</table>[/html]

По моему самый что ни на есть оптимизированный код

[RED 1]

поставим вопрос так: вот этот код

<table border="1">

<tr>

<td>&nbsp;</td>

</tr>

</table>

можно отобразить дивами?

Если да, то можно пример!

[max-money 0]

<div style="border: 2px ridge #808080;">&nbsp;</div>

Только с border поиграться нужно кабы точно угадать.

[lifestar 18]

RED, таблицы вообще то используются по своему прямому назначению =)

Должны по крайней мере

[RED 1]

Lifestar. Я скачал учебник по css. В нем есть раздел таблицы, а примеров нет. Вот я и заморочился, можно ли с помощью css отобразить один в один верстку которую я бы сделал таблицами.

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

Решил верстать комбинированно и все бы хорошо, но увидел в учебнике раздел про таблицы и задумался, может все можно на css сверстать. Поэтому возник вопрос можно ли выше приведенную таблицу сделать полностью на дивах? Стиль задать для таблицы это я понял, а вот полностью табличный код можно слоями отобразить?Lifestar ответте пожалуйста подробней. От Ваших коротких высказываний у меня информации (полезной) не прибавляется. Мало знаний у меня, поэтому, так сказать, прошу расживать.

Почему именно таблицы. Потому что у меня таблица с одной строкой и 5-ю столбцами.

в двух столбцах текст в трех графика в виде обтекающих рамок. Если использовать таблицу то высота

столбцов с графическими изображениями будет автоматически равна высоте столбцов с текстом. Пробовал тоже самое сделать слоями не выходит. Поэтому и возник вопрос отображения таблицы полностью на css чтобы по мере наполнения столбца текстом, высота столбца с графикой была бы одинаковой столбцу с текстом только все это должно быть на css.

Посоветуйте что-нибудь может как по другому сделать.

[Torquemada 0]

[offtopic]RED, а учебником не поделитесь?) А то мне шаблон верстать, а как раз в верстке я ноль полный, даже палочки нету))[/offtopic]

[RED 1]

Вот здесь посмотрите: http://css-info.narod.ru/ думаю по

нятно будет