Это MWEB.RU

Не узнаешь, %username%?

Пропустить

Вопросы по DIV

Старый mweb

Модератор: [mweb team]

Ответить

Вопросы по DIV

Сообщение Василий Сб авг 16, 2008 1:17

Здравствуйте, писал я код, и столкнулся с такой проблемой

Изображение

Нужно мне было написать код, чтобы изображения размещлись как на картинке. но вот в том проблема,что если дивы размещать друг под другом
то уже не будет токого эффекта, они просто встанут друг над другом и отступами делу не поможешь.
Поэтому прошу, подскажите, как можно
поставить див, чтобы иображения в них были как на картинке, спасибо
Василий
Редко заходит
 
Сообщения: 135
Зарегистрирован: Ср янв 03, 2007 18:17
Вернуться к началу

Сообщение Alkeeper Сб авг 16, 2008 7:14

div1, div2 { float: left;}
div3 {clear: both;}
80 лет в интернете.
Аватара пользователя
Alkeeper
Экс-курильщик
 
Сообщения: 4183
Зарегистрирован: Вт ноя 13, 2001 1:01
Откуда: mweb
Вернуться к началу

Сообщение Василий Ср авг 20, 2008 22:26

Есть еще небольшой вопрос, мой сайт www.vburg.ru, в бразерах mozilla firefox и opera, выдает ужасную картину, когда как в эксплорере все норма, есть подозрения, что виноваты теги margin или float, из з которых все плывет, в общем помогите плз.

CSS
Код: Выделить всё


#fon {
   left: 0px;
   top: 0px;
   right: 0px;
   bottom: -100px;
   position: absolute;
   margin-left:0px;
   margin-right:0px;
   margin-bottom:0px;
   margin-top:0px;
   background-image: url(img/fon.jpg);
   height:1400px;
   width:101.6%;
}

#shap{
   position: relative;
   top: -15px;
   left:-9px;
   }

#pod{
   position: relative;
   top: -15px;
   left:-9px;
   }

#menu{
   position: relative;
   top: -150px;
   left:-9px;
   margin-left:-650px;
   margin-top:200px;
   }


#text{
   position: relative;
   top: -15px;
   left:250px;
   margin-right:10px;
   }



#vp{
   position: relative;
   top: 1px;
   left:-9px;
   }

#sp{
   position: relative;
   top: -3px;
   left:-9px;
   background-image: url(img/sredplah.gif);
   height:71px;
   width:980px;
   clear:both;
   }

#dp{
   position: relative;
   top: -3px;
   left:-9px;
   }

#pod{
   position: relative;
   top: 5px;
   left:-9px;
   }


#butstrok{
   position: relative;
   top: -20px;
   left:-9px;
   }
   
#b1{
   position: relative;
   top: -22px;
   left:-9px;
   }
   
#b2{
   position: relative;
   top: -105px;
   left:10px;
   }
#b3{
   position: relative;
   top:-75px;
   left:-9px;
   }



#copy{
   
   position: relative;
   top:-125px;
   left:-9px;
   }


A.h1:link
   {
   color:2E94FA;
   text-decoration:none;
   font-size: 12pt;   
}
   
   
A.h1:active
   {
   text-decoration:none;
   color:#2E94FA;   
   font-size: 12pt;
}
   
   
A.h1:hover
   {
   text-decoration:none;
   color:#0961B9;
   font-size: 12pt;
}
   
A.h1:visited
   {

   text-decoration:none;
   color:#2E94FA;   
   font-size: 12pt;
   }

p.text
   {
   margin-right:20px;
   margin-top:2px;
   color:#06325E;
   font-size: 16pt;
   margin-left:5px;   
   text-align:left;
   font-family:arial;

}   



p.text:first-letter{

color:#784923;
font-size:16pt;
}

img.izo
   {
   margin-left:2px;
   margin-right:5px;
   margin-top: 20px;
   margin-left:25px;
   align-left: absmiddle;
}

img.izo2
   {
   margin-left:2px;
   margin-right:5px;
   margin-top: 1px;
   margin-left:25px;
   align-left: absmiddle;
}

p.ptex2
{
   text-align:center;
   color:784923;
   font-family: Arial;
   font-size: 20pt;
   }

p.ptex
{
   text-align:left;
   color:784923;
   font-family: Arial;
   font-size: 12pt;
   }

p.pmenu
{
   text-align:left;
   color:784923;
   font-family: Arial;
   font-size: 16pt;
}

p.pmenu2
{
   padding-top:5px;
   text-align:left;
   color:#784923;
   font-family: Arial;
   font-size: 16pt;
}

A.hmen2
{
   text-decoration:none;
   text-align:left;
   color:784923;
   font-family: Arial;
   font-size: 16pt;
   padding-top: -10px;
}

A.hmen2:hover
{
   text-decoration:underline;
   text-align:left;
   color:#63472E;
   font-family: Arial;
   font-size: 16pt;
   margin-top: -10px;
   }


   
#d1
{
padding-top:150px;
float:left;
margin-left:10px;
}

#d2
{
padding-top:30px;
float:right;
margin-right:25px;
margin-left:25px;
padding-bottom:20px;
}

A.hmen
{   
   text-decoration:none;
   text-align:left;
   color:#784923;
   font-family: Arial;
   font-size: 16pt;
}

A.hmen:hover
{   
   text-decoration:underline;
   text-align:left;
   color:#63472E;
   font-family: Arial;
   font-size: 16pt;
   }


   
img.uz
{
padding-top:1px;
}

   
   



HTML

Код: Выделить всё

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">

<html>
<head>
   <title>Выборг</title>
   <META NAME="description" CONTENT="Выборг">
   <META NAME="keywords" CONTENT="Выборг">
   <META HTTP-EQUIV="Content-Type" CONTENT="text/html; charset=windows-1251">
   <LINK REL =stylesheet TYPE="text/css" HREF="style2.css">
</head>
<body>

<div id="fon">
</div>

<div align="center">
<div id="shap">
<img src="img/shap.gif" width="980px" height="210px"/>
</div>
</div>

<div align="center">
<div id="b1">
<table width="980px" height="47px" >
<tr>
<td>
<a href="http://www.vburg.ru"><img src="img/glav.gif" width="211" height="102px" border="0" alt="Выборг"/></a>
</td>
<td>
<a href="http://www.vburg.ru/otdyh.htm"><img src="img/otdih.gif" width="211" height="102px" border="0" alt="Отдых в Выборге"/></a>
</td>
<td>
<a href="http://www.vburg.ru/galer.htm"><img src="img/galer.gif" width="211" height="102px" border="0" alt="Галерея"/></a>
</td>
<td>
<a href="http://www.vburg.ru/partner.htm"><img src="img/partner.gif" width="211" height="102px" border="0" alt="Партнеры"/></a>
</td>
<td>
</tr>
</table>
</div>

<div align="center">
<div id="vp">
<img src="img/vp.gif" width="980" height="25px" border="0"/>
</div>
</div>

<div align="center">
<div id="sp">
<div id="d1">

<p class="pmenu"><img class="izo" src="img/uz.gif"/><a class="hmen" href="http://www.vburg.ru">Главная</p></a></br>
<p class="pmenu2"><img class="izo2" src="img/uz.gif"/><a class="hmen2" href="http://www.vburg.ru/history.htm">История</p></a></br>
<p class="pmenu2"><img class="izo2" src="img/uz.gif"/><a class="hmen2" href="http://www.vburg.ru/fakt.htm">Факты</p></a></br>
<p class="pmenu2"><img class="izo2" src="img/uz.gif"/><a class="hmen2" href="http://www.vburg.ru/turnir.htm">Турниры</p></a></br>
<p class="pmenu2"><img class="izo2" src="img/uz.gif"/><a class="hmen2" href="http://www.vburg.ru/knigi.htm">Книги</p></a></br>
<p class="pmenu2"><img class="izo2" src="img/uz.gif"/><a class="hmen2" href="http://www.vburg.ru/video.htm">Видео</p></a></br>
<p class="pmenu2"><img class="izo2" src="img/uz.gif"/><a class="hmen2" href="http://www.vburg.ru/museum.htm">Музей</p></a></br>
</div>

<div id="d2">
<img class="uz" src="img/vuz.gif" align="center"/>
<p class="ptex2">
Выборг
</p>

<p class="ptex">

</p>
<p class="ptex">

</p>
<img  src="img/nuz.gif" align="center"/>
</div>

</div>
</div>

<div align="center">
<div id="dp">
<img src="img/np.gif" width="980" height="25px" border="0"/>
</div>
</div>

<div align="center">
<div id="pod">
<table background="img/podval.gif" width="980" height="60px" border="0" cellpadding="5px"/>
<tr align="left">
<td>
<a href="http://www.strongholders.ru" target="_blank"><img src="stronghold.gif" width=88 height=31 alt="Stronghold" border="0"></a>
</td>
</tr>
</table>
</div>
</div>

</body>
</html>
Василий
Редко заходит
 
Сообщения: 135
Зарегистрирован: Ср янв 03, 2007 18:17
Вернуться к началу
Ответить

Вернуться в Архив

Кто сейчас на конференции

Сейчас этот форум просматривают: нет зарегистрированных пользователей и гости: 22



1998–2008 © Все интересы учтены. Команда mweb
Работает на движке phpBB

Рейтинг@Mail.ru

cron