Реклама на сайте Advertise with us

Проблема с CSS

Расширенный поиск по форуму
 
Новая тема Новая тема   
Автор
Поиск в теме:

чоткий дезайнер

С нами с 20.07.06
Сообщения: 1782
Рейтинг: 731

Ссылка на сообщениеДобавлено: 04/05/08 в 18:47       Ответить с цитатойцитата 

значит, есть вот такой код
Код:

<!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" lang="en" xml:lang="en">
<head>
  <title>index</title>
  <meta http-equiv="Content-type" content="text/html; charset=windows-1251" />
  <meta http-equiv="Content-Language" content="ru-ru" />
  <style>
body {
   font-family: Verdana, Tahoma, Helvetica, Arial, sans-serif;
   background: #999966;
   }
* {margin: 0; padding: 0;}
#header {
   width: 960px;
   height: 230px;
   background: #CCCC66;
      }
#header h1 {
   margin: 150px 475px 0 0;
   font-size: 24px;
   color:#FFFFFF;
   background: #666633;
   }
  </style>
</head>
<body>
   <div id="header">
      <h1>Заголовок</h1>
   </div>   
</body>
</html>

в IE выглядит как я и хотел, то есть заголовок со своим бэкграундом располагается внутри шапки с отступом сверху 150 px,
но в опере и лисе он расположен в верхнем левом углу шапки, а сама шапка отступает (вероятно на 150 px) от верхнего края окна,
можно это вылечить?

использование padding вместо margin не предлагать, п.ч. надо чтобы у заголовка был бэкграунд в виде полоски

спасибо icon_smile.gif

0
 



С нами с 11.11.06
Сообщения: 75
Рейтинг: 59

Ссылка на сообщениеДобавлено: 04/05/08 в 19:26       Ответить с цитатойцитата 

попробуй поставить так
Код:

<!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" lang="en" xml:lang="en">
<head>
  <title>index</title>
  <meta http-equiv="Content-type" content="text/html; charset=windows-1251" />
  <meta http-equiv="Content-Language" content="ru-ru" />
  <style>
body {
   font-family: Verdana, Tahoma, Helvetica, Arial, sans-serif;
   background: #999966;
   }
* {margin: 0; padding: 0;}
.header {
   width: 960px;
   height: 230px;
   background: #CCCC66;
      }
h1 {
   margin: 0px 475px 0 0;
   font-size: 24px;
   color:#FFFFFF;
   background: #666633;
   position:relative; top:150px;
   }
  </style>
</head>
<body>
   <div class="header">
      <h1>Заголовок</h1>
   </div>   
</body>
</html>

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

4
 

чоткий дезайнер

С нами с 20.07.06
Сообщения: 1782
Рейтинг: 731

Ссылка на сообщениеДобавлено: 04/05/08 в 19:50       Ответить с цитатойцитата 

CostOut, спасибо, оценил. в опере тоже работает

но ещё нашел более очевидный вариант, убрать margin-top у заголовка, а к #header добавить padding-top:150px и вычесть его из высоты, то есть height:80px

0
 

чоткий дезайнер

С нами с 20.07.06
Сообщения: 1782
Рейтинг: 731

Ссылка на сообщениеДобавлено: 04/05/08 в 20:23       Ответить с цитатойцитата 

ещё вопрос
страница с DOCTYPE XHTML 1.0 Strict не проходит проверку валидатором (если поменять на Transitional все нормально), а виновата во всем форма поиска
Код:
<form name="search" action="/">
<input type="text" class="formtext" />
<input type="submit" class="formbutton" value="Найти" />
</form>   

ему не нравится name и input

пишет вот что,
не пойму, их надо заменить на другие теги? или в css-файл что-то вынести надо?
CSS гуру, подскажите )

Цитата:
Line 35, Column 11: there is no attribute "name".
<form name="search" action="/">

You have used the attribute named above in your document, but the document type you are using does not support that attribute for this element. This error is often caused by incorrect use of the "Strict" document type with a document that uses frames (e.g. you must use the "Transitional" document type to get the "target" attribute), or by using vendor proprietary extensions such as "marginheight" (this is usually fixed by using CSS to achieve the desired effect instead).

This error may also result if the element itself is not supported in the document type you are using, as an undefined element will have no supported attributes; in this case, see the element-undefined error message for further information.

How to fix: check the spelling and case of the element and attribute, (Remember XHTML is all lower-case) and/or check that they are both allowed in the chosen document type, and/or use CSS instead of this attribute. If you received this error when using the <embed> element to incorporate flash media in a Web page, see the FAQ item on valid flash.


Цитата:
Line 36, Column 37: document type does not allow element "input" here; missing one of "p", "h1", "h2", "h3", "h4", "h5", "h6", "div", "pre", "address", "fieldset", "ins", "del" start-tag.
<input type="text" class="formtext" />

The mentioned element is not allowed to appear in the context in which you've placed it; the other mentioned elements are the only ones that are both allowed there and can contain the element mentioned. This might mean that you need a containing element, or possibly that you've forgotten to close a previous element.

One possible cause for this message is that you have attempted to put a block-level element (such as "<p>" or "<table>") inside an inline element (such as "<a>", "<span>", or "<font>").


для второго input пишет тоже самое

0
 

Раздаю инвайты, ищу линк-трейд

С нами с 20.08.04
Сообщения: 16631
Рейтинг: 8593


Передовик Master-X (16.11.2006) Передовик Master-X (01.09.2019)
Ссылка на сообщениеДобавлено: 04/05/08 в 20:43       Ответить с цитатойцитата 

Попробуй тело формы взять в < fieldset > или хоть div'ами внутри поиграть[/code]

Кому ссылку?
RU и EN Dating

4
 

Адалт кутюрье

С нами с 16.04.06
Сообщения: 1322
Рейтинг: 827

Ссылка на сообщениеДобавлено: 04/05/08 в 21:21       Ответить с цитатойцитата 

как вариант - забей на валидатор..=)

Одеваю сайты Adult Concept Design Меняю денюжку erMoney.com

4
 

чоткий дезайнер

С нами с 20.07.06
Сообщения: 1782
Рейтинг: 731

Ссылка на сообщениеДобавлено: 04/05/08 в 21:28       Ответить с цитатойцитата 

pierx, спасибо, инпуты внутрь дива засунул - минус две ошибки )
name удалил - теперь всё валидно icon_smile.gif

Dizman©, да я особо и не парюсь, но валидный код душу всё-таки греет немного, можно кнопочку "Valid XHTML 1.0 Strict" на сайт повесить =)
хотя цсс все равно с хаками

0
 
Новая тема Новая тема   

Текстовая реклама в форме ответа
Заголовок и до четырех строчек текста
Длина текста до 350 символов
Купить рекламу в этом месте!


Перейти:  



Спонсор раздела Стань спонсором этого раздела!

Реклама на сайте Advertise with us

Опросы

Рецепт новогоднего блюда 2022



Обсудите на форуме обсудить (11)
все опросы »