CSS и class не верное отображение

Felix · 16.12.2009

И так у меня вот какой проблем. Мой сайт отображается так.

Но только как добавляю это

Код:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">

И всё начинает вот так отображаться. В чём причина? Прилогаю CSS

Код:

.lm a {
	background: url(../images/mm.png);
                height:52px;
                width:140;
                padding:19;
                color:fff;
                font-weight:700;}

.lm a:hover {
	background: url(../images/mmh.png);
                height:52px;
                width:140;
                padding:19;
                color:fff;
font-weight:700;}

Это горизонтальное меню. И сама строка меню.

Код:

<td class="lm"><a href="/index.php" title="В начало">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;В начало&nbsp;&nbsp;&nbsp;&nbsp;</a></td>

И вертикальное меню CSS

Код:

.story_a {
        width:110px;
        text-align:left;        /*align*/
        vertical-align:top;     /*valign*/
        background:#f1f9ff;
        }  

.story_tex {
        color:#36a0ba;          /*font color*/
        font-weight:bold;       /*<b>*/
       }

Строка вертикального меню

Код:

<img class="kat" src="{THEME}/images/button_1.gif" alt="">&nbsp;<A href="/1/" class="menua" title=">Бла бла бла</A><br>

Что у меня не так ?

Creator · 16.12.2009

Доктайп используй этот:

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">

Ты используешь strict, а там очень много ограничений, которые не реализованы самим движком DLE.

Felix · 16.12.2009

Не помогло!

Всё как было криво так и осталось.

blackcot · 16.12.2009

Выложите CSS правило для .lm и код левой колонки

Felix · 16.12.2009

так всё же в 1 посту есть :huh:

tigra60 · 16.12.2009

Для верхнего меню попробуйте правильно определить цвет текста - не color:fff, а color:#fff ( а лучше color:#ffffff).
В вертикальном меню имена классов в CSS и в HTML почему-то разные... Может быть именно здесь "хюндин геграбен"?
Удачи!

blackcot · 17.12.2009

Felix сказал(а):
так всё же в 1 посту есть :huh:

Там правило для ссылки находящейся в элементе с классом .lm, а кода левой колонки нет, т.е. где находится список ссылок в div, td и т.д.

Хотя в .lm a{...} попробуйте добавить display:block, чтобы сработал height:52px

blackcot · 17.12.2009

Вот код для верхнего меню

Код:

.lm {
	background: url(../images/mm.png);
	height: 52px;
	width: 140px;
	text-align: center;
	vertical-align: middle;
}
.lm a {
	display: table-cell;
	height: 52px;
	width: 140px;
	padding: 19;
	color: #fff;
	font-weight: 700;
	vertical-align: middle;
	text-align: center;
}
.lm:hover {
	background: url(../images/mmh.png);
}

Попробуйте.

Felix · 17.12.2009

Такс горизонтальное меню работает как нужно. За это спс.

Что делать в вертикальным меню ? Как его поченить ?

Как заставить текст быть по центру ?

Код:

<tr>
 <td class="top_l" width="6">&nbsp;</td>
 <td colspan="3" align="left" valign="top" class="top_cen" style="padding: 10 0 0 0px;">
<div height="15" style="float:right"><b>Категория ~ {link-category}</b></div>
<div height="15" style="text-align:left;"><b>[full-link]{title}[/full-link]</b></div></td>
 <td class="top_r" width="27"><table><tr><td style="padding:0px"></td></tr></table></td>
 </tr>

Это после DOCTYPE так стало.

blackcot · 17.12.2009

Поменяйте в этом коде valign="top" на valign="middle"

P.S. Вообще то, половина кода на сайте не соответствует "доктайпу". Если хотите сделать код валидным - нужно его серьезно перелопачивать. Есть хороший HTML-редактор?

Felix · 17.12.2009

blackcot сказал(а):
Поменяйте в этом коде valign="top" на valign="middle"

P.S. Вообще то, половина кода на сайте не соответствует "доктайпу". Если хотите сделать код валидным - нужно его серьезно перелопачивать. Есть хороший HTML-редактор?

Есть ДримВивер и notepad++. Что посоветуете ?

blackcot · 17.12.2009

Notepad++ лучше использовать для написания скриптов.
Dreamweaver, по идее, должен автоматически проверять код на валидность.
Я использую MS Expression Web 3 - не могу нарадоваться.

Felix · 22.12.2009

Поменяйте в этом коде valign="top" на valign="middle"

Не помогло.

С меню также всё ещё не разобрался.

Если кто в курсе как исправить подскажите! :blink:

Я использую MS Expression Web 3 - не могу нарадоваться.

Где скачать можно? хотелось бы бесплатную :blush:

Creator · 22.12.2009

С меню также всё ещё не разобрался. Если кто в курсе как исправить подскажите!

Попробуй так:

Код:

<tr>
 <td class="top_l" width="6"> </td>
 <td colspan="3" align="left" valign="middle" class="top_cen" style="padding: 10 0 0 0px;">
<div height="15" style="float: right;"><b>Категория ~ {link-category}</b></div>
<b>[full-link]{title}[/full-link]</b></td>
 <td class="top_r" width="27"><table><tr><td style="padding:0px"></td></tr></table></td>
 </tr>

Felix · 24.12.2009

Всё разобрался сам во всё!

В место padding использовал margin и всё это убрал в CSS в результате всё заработало как надо.

Код:

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">

Прописал и с ним отображается всё как надо остались меленькие мелочи и недочёты это всё по немного исправлю.

Всем кто принял участие в обсуждении Спасибо! Тему можно закрывать.

CSS и class не верное отображение

Felix

Друг форума

Creator

Administrator

Felix

Друг форума

blackcot

Well-Known Member

Felix

Друг форума

tigra60

Спасатель

blackcot

Well-Known Member

blackcot

Well-Known Member

Felix

Друг форума

blackcot

Well-Known Member

Felix

Друг форума

blackcot

Well-Known Member

Felix

Друг форума

Creator

Administrator

Felix

Друг форума

Онлайн статистика

Статистика форума

Новые пользователи

Поделиться этой страницей