VPF::разрыв между div и img - Форум программистов

Treod

Дата 7.4.2009, 16:51 (ссылка)

(нет голосов)

Загрузка ...

Бывалый

Профиль
Группа: Участник
Сообщений: 203
Регистрация: 21.11.2007

Репутация: нет
Всего: 2

Вот собственно:
user posted image

Код


<!-- Date created: 07.04.2009 -->
<!DOCTYPE HTML PUBLIC  "-//W3C//DTD HTML 4.0  Transitional//RU"
"http://www.w3.org/TR/REC-html40/loose.dtd">
<html>
  <head>
    <title></title>
    <link rel="stylesheet" type="text/css" href="css/style.css">
  </head>
  <body>
  <!--Áàçîâûé êîíòåéíåð-->
  <div id="dvmaincontainer">
    <div id="dvtopcontainer">
    
      <div id="dvlogocontainer">
        <h1>Environmental Brand</h1>
        <h4>Íàçâàíèå êîìïàíèè</h4>
      </div>
      
      <div id="dvnavicontainer">
        <img src="images/navi_left.jpg" alt="" />
        <div id="tabs1" >
          <ul>
            <li id="current"><a href="#"><span>Ãëàâíàÿ</span></a></li>
            <li><a href="#"><span>Ñåðâèñ</span></a></li>
            <li><a href="#"><span>Ïîðòôîëèî</span></a></li>
            <li><a href="#"><span>Áëîã</span></a></li>
            <li><a href="#"><span>Îáðàòíàÿ ñâÿçü</span></a></li>
          </ul>
        </div>
        <img src="images/navi_right.jpg" alt="" />
      </div>
      
    </div>
  </div>
  </body>
</html>

Код


* {
  margin:0;
  padding:0
}

body {
  margin:0px;
  background-image: url(../images/body_bg.jpg);
  background-repeat: repeat-x;
  background-color: #3F2F22;
  font-family: 'Helvetica', Arial, Verdana;
  text-align: center;
}

#dvmaincontainer {
  width: 900px;
  margin: 0px auto;
}

#dvmaincontainer #dvtopcontainer {
  float: left;
  width: 900px;
  margin: 0px;
  padding: 0px 0px 0px 0px;
}

#dvtopcontainer #dvlogocontainer {
  float: left;
  width: 324px;
  font-size: 0px;
  margin: 0px;
  padding-left: 0px 71px 0px 0px;
}

#dvlogocontainer h1 {
  float:right;
  width:314px;
  font-family:Arial, Helvetica, sans-serif;
  font-size:31px;
  text-align:right;
  font-weight:bold;
  color:#F8F4D5;
  margin:0px;
  padding:32px 0px 0px 0px;
}
#dvlogocontainer h4 {
  float:right;
  width:198px;
  font-family:Arial, Helvetica, sans-serif;
  font-size:14px;
  text-align:right;
  font-weight:bold;
  color:#BB9F89;
  margin:0px;
  padding:0px 0px 30px 0px;
}

#dvtopcontainer #dvnavicontainer {
  float: right;
  width: 445px;
  font-size: 0px;
  margin: 0px;
  padding: 0px 0px 0px 0px;
}

#dvnavicontainer img {
  float: left;
  font-size: 0px;
  margin: 0px;
  padding: 0px;
}

/*- Menu Tabs 1--------------------------- */
#tabs1 {
  float: left;
  background: #FAF6DB;
  font-size: 13px;
  line-height: normal;
  font-family: Arial;
  font-weight: bold;
  padding-top: 10px;
  padding-bottom: 5px;
  height: 26px;
  margin: 0px;
  line-height: normal;
}

#tabs1 ul {
  margin: 0;
  list-style: none;
  float: left;
  padding: 0px;
}

#tabs1 li {
  display: inline;
  margin: 0;
  padding: 0;
  line-height: 16px;
  height: 25px;
  float: left;
}
#tabs1 a {
  float: left;
  background: url("../images/tableft1.gif") no-repeat left top;
  margin: 0;
  padding: 0 0 0 4px;
  text-decoration: none;
}

#tabs1 a span {
  float: left;
  display: block;
  background: url("../images/tabright1.gif") no-repeat right top;
  color: #2C1C0F;
  padding: 3px 9px 6px 5px;
  padding-top: 2px;
}

#tabs1 a:hover {
  background-position:0% -42px;
  color:#FFFFFF;
}
#tabs1 a:hover span {
  background-position:100% -42px;
  color:#FFFFFF;
}

#tabs1 #current a {
  background-position:0% -42px;
  color:#FFFFFF;
}

#tabs1 #current a span {
  background-position:100% -42px;
  color:#FFFFFF;
}
/*-----------------------------Menu ------------------------------*/

bars80080

Дата 7.4.2009, 19:42 (ссылка)

(нет голосов)

Загрузка ...

прапор творюет

Награды: 1

Профиль
Группа: Завсегдатай
Сообщений: 12022
Регистрация: 5.12.2007
Где: Königsberg

Репутация: 50
Всего: 315

может картинка косячит, попробуй ещё добавить

#dvnavicontainer img { display: block; }

но я б такую весчь сделал бы на таблице, а картинки боковых сторон задал бэкграундом

Nikol

Дата 7.4.2009, 22:26 (ссылка)

(нет голосов)

Загрузка ...

Шустрый

Профиль
Группа: Участник
Сообщений: 123
Регистрация: 5.4.2006
Где: Берег Черного мор я

Репутация: 2
Всего: 4

img {border:none;} еще можно попробовать. Но я бы тоже бекграундом сделала.

Это сообщение отредактировал(а) Nikol - 7.4.2009, 22:29

--------------------

Я не волшебник, я только учусь.

ksnk

Дата 7.4.2009, 22:43 (ссылка)

(нет голосов)

Загрузка ...

прохожий

Профиль
Группа: Комодератор
Сообщений: 6855
Регистрация: 13.4.2007
Где: СПб

Репутация: 48
Всего: 386

Можно еще убрать пробельные символы (переводы строк) между эти Div и img.
А лучше воспользоваться советом bars80080

--------------------

Человеку свойственно ошибаться, программисту свойственно ошибаться профессионально ! user posted image

0 Пользователей читают эту тему (0 Гостей и 0 Скрытых Пользователей)
0 Пользователей:
« Предыдущая тема \| Вёрстка веб-сайтов \| Следующая тема »