VatrSite
HTML
<div id="topback">
<div id="wrapper">
<div id="header">
<div class="layer1">
<div class="layerLogo"></div>
<div class="LayerContacts"><div class="LayerIcon"></div>
+ 375 44 000-00-00</br>
+ 375 44 000-00-00</br>
+ 375 44 000-00-00</br>
</div>
<div class="layer11">Ãëàâíàÿ ñòðàíèöà | Êîíòàêòû</div>
</div>
</div><!-- #header-->
<div class="menu">
<div class="AltMenu">
<div class="MenuBlock">
<Span style="color:#d24a45; font-size:16px">Íàâèãàöèÿ</span>
<br>
<br>Ìåáåëü äëÿ äîìà
<br>Ìåáåëü äëÿ áàðà è êàôå
<br>Ìåáåëü äëÿ îôèñà
</div></div></div>
<div id="content">
<strong>Content:</strong> Sed placerat accumsan ligula. Aliquam felis magna, congue quis, tempus eu, aliquam vitae, ante. Cras neque justo, ultrices at, rhoncus a, facilisis eget, nisl. Quisque vitae pede. Nam et augue. Se d a elit. Ut vel massa. Suspendisse nibh pede, ultrices vitae, ultrices nec, mollis non, nibh. In sit amet pede quis leo vulputate hendrerit. Cras laoreet leo et justo auctor condimentum. Integer id enim. Suspendisse egestas, dui ac egestas mollis, libero orci hendrerit lacus, et malesuada lorem neque ac libero. Morbi tempor pulvinar pede. Donec vel elit.Sed placerat accumsan ligula. Aliquam felis magna, congue quis, tempus eu, aliquam vitae, ante. Cras neque justo, ultrices at, rhoncus a, facilisis eget, nisl. Quisque vitae pede. Nam et augue. Se d a elit. Ut vel massa. Suspendisse nibh pede, ultrices vitae, ultrices nec, mollis non, nibh. In sit amet pede quis leo vulputate hendrerit. Cras laoreet leo et justo auctor condimentum. Integer id enim. Suspendisse egestas, dui ac egestas mollis, libero orci hendrerit lacus, et malesuada lorem neque ac libero. Morbi tempor pulvinar pede. Donec vel elit.Sed placerat accumsan ligula. Aliquam felis magna, congue quis, tempus eu, aliquam vitae, ante. Cras neque justo, ultrices at, rhoncus a, facilisis eget, nisl. Quisque vitae pede. Nam...
CSS
* {
margin: 0;
padding: 0;
}
html {
height: 100%;
}
body {
font: 12px/18px Arial, Tahoma, Verdana, sans-serif;
width: 100%;
height: 100%;
background-color: #eaeaea
}
a {
color: blue;
outline: none;
text-decoration: underline;
}
a:hover {
text-decoration: none;
}
p {
margin: 0 0 18px
}
img {
border: none;
}
input {
vertical-align: middle;
}
#wrapper {
width: 970px;
margin: 0 auto;
min-height: 100%;
height: auto !important;
height: 100%;
}
#topback {
position: absolute;
width: 100%;
height: 262px;
background-color: #e0dfdf;
}
/* Header
-----------------------------------------------------------------------------*/
#header {
height: 240px;
}
#TableHeader {
border-width: 0px;
background-color: transparent;
}
/* Middle
-----------------------------------------------------------------------------*/
.menu {
border-radius: 9px;
-moz-box-shadow: 0 0 8px rgba(0,0,0,0.3); /* Äëÿ Firefox */
-webkit-box-shadow: 0 0 8px rgba(0,0,0,0.3); /* Äëÿ Safari è Chrome */
box-shadow: 0 0 8px rgba(0,0,0,0.3); /* Ïàðàìåòðû òåíè */
margin-left: 5px;
margin-right: 5px;
top:-44px;
height:439px;
position: relative;
background-color: #f6f6f6;
padding-right: 20px;
padding-bottom: 12px;
padding-left: 12px;
padding-top: 12px;
}
.AltMenu {
float: right;
background-image: url(image/shadow.png);
background-repeat: no-repeat;
width:248px;
height: 316px;
position: relative;
top:-12px;
}
.MenuBlock {
padding:15px 27px;
font-size:14px
}
#content {
border-radius: 9px;
-moz-box-shadow: 0 0 8px rgba(0,0,0,0.3); /* Äëÿ Firefox */
-webkit-box-shadow: 0 0 8px rgba(0,0,0,0.3); /* Äëÿ Safari è Chrome */
box-shadow: 0 0 8px rgba(0,0,0,0.3); /* Ïàðàìåòðû òåíè */
margin-left: 5px;
margin-right: 5px;
position: relative;
background-color: #f6f6f6;
padding-left: 40px;
padding-right: 20px;
padding-top: 20px;
padding-bottom: 20px;
margin-bottom: 20px;
top:-20px;
}
/* Footer
-----------------------------------------------------------------------------*/
#footer...