Так как начинающий web прораммист, прошу Вас опытных программистов помочь.
Сделал сайт, но упустил момент подстройки интерфейса сайта под монитор, изначально в css задал ширину 1920 и высоту 1200 (т.к. фон сделан слайдом из широкоформатных фоток), у меня монитор 23 дюйма, поэтому проблем нету, а как сделать чтоб на любом широкоформатном мониторе сайт помещался в размеры экрана???
Знающим прошу прокомментировать, заранее спасибо)
Ниже прикладываю css и ссылка на сайт exclusivestroy.com.ua
CSS:
Предупреждение: Помехи!ul,ol,li,h1,h2,h3,h4,h5,h6,pre,form,body,html,p,blockquote,fieldset,input{margin:0; padding:0;}
.break { clear:both; }
#header {
width:1920px;height:1174px;position:absolute;
}
.headerimg {
background-position: center top;
background-repeat: no-repeat;
width:100%;
height:100%;
position:absolute;
}
.btn { height:32px; width:32px; float:left; cursor:pointer; }
#back { background-image:url("../images/btn_back.png"); }
#next { background-image:url("../images/btn_next.png"); }
#control { background-image:url("../images/btn_pause.png"); }
#headernav-outer { position:relative; top:650px; margin-right:10px; width:960px; }
#headernav { padding-left:864px;}
/*Menu*/
ul.sdt_menu{
list-style: none;
font-family:"Myriad Pro", "Trebuchet MS", sans-serif;
font-size:14px;
width:1020px;
margin-left:300px;
margin-top:-135px;
}
ul.sdt_menu a{
text-decoration:none;
outline:none;
}
ul.sdt_menu li{
float:left;
width:170px;
height:85px;
position:relative;
cursor:pointer;
}
ul.sdt_menu li > a{
position:absolute;
top:0px;
left:0px;
width:170px;
height:85px;
z-index:12;
background:transparent url(../images/overlay.png) no-repeat bottom right;
-moz-box-shadow:0px 0px 2px #000 inset;
-webkit-box-shadow:0px 0px 2px #000 inset;
box-shadow:0px 0px 2px #000 inset;
}
ul.sdt_menu li a img{
border:none;
position:absolute;
width:0px;
height:0px;
bottom:0px;
left:85px;
z-index:100;
-moz-box-shadow:0px 0px 4px #000;
-webkit-box-shadow:0px 0px 4px #000;
box-shadow:0px 0px 4px #000;
opacity:1;
}
ul.sdt_menu li span.sdt_wrap{
position:absolute;
top:25px;
left:0px;
width:170px;
height:60px;
z-index:15;
}
ul.sdt_menu li span.sdt_active{
position:absolute;
background: #333;
top:85px;
width:170px;
height:0px;
left:0px;
z-index:14;
-moz-box-shadow:0px 0px 4px #000 inset;
-webkit-box-shadow:0px 0px 4px #000 inset;
box-shadow:0px 0px 4px #000 inset;
opacity:0.9;
}
ul.sdt_menu li span span.sdt_link,
ul.sdt_menu li span span.sdt_descr,
ul.sdt_menu li div.sdt_box a{
margin-left:15px;
text-transform:uppercase;
text-shadow:1px 1px 1px #000;
}
ul.sdt_menu li span span.sdt_link{
color: #FFF;
font-size:24px;
float:left;
clear:both;
}
ul.sdt_menu li span span.sdt_descr{
color: #FFF;
float:left;
clear:both;
width:155px;
font-size:10px;
letter-spacing:1px;
}
ul.sdt_menu li div.sdt_box{
display:block;
position: absolute;
width:385px;
overflow:hidden;
height:570px;
top:85px;
left:0px;
display:none;
background: #333;
font-size:10px;
z-index:15;
opacity:0.9;
}
ul.sdt_menu li div.sdt_box a{
float:left;
clear:both;
line-height:30px;
color: #FFF;
}
ul.sdt_menu li div.sdt_box a:first-child{
margin-top:15px;
}
ul.sdt_menu li div.sdt_box a:hover{
color: #96F;
}
.featured_box .floater{
font-family:"Myriad Pro", "Trebuchet MS", sans-serif;
display:block;
position:absolute;
top:250px;
right:1060px;
width:550px;
height:445px;
margin:0;
padding:5px;
background: #FFF;
overflow:hidden;
opacity: 0.8;
color: #000;
}
.featured_box p{
margin:0;
padding:0;
line-height:1.6em;
}
#bg{
display:block;
position:absolute;
top:250px;
right:1180px;
margin:0;
padding:5px;
}
#bn{
display:block;
position:absolute;
top:535px;
right:1180px;
margin:0;
padding:5px;
}
#bc{
display:block;
position:absolute;
top:250px;
right:1650px;
margin:0;
padding:5px;
}
#bv{
display:block;
position:absolute;
top:285px;
right:1790px;
margin:0;
padding:5px;
}
#bi{
display:block;
position:absolute;
top:895px;
right:890px;
margin:0;
padding:5px;
}
#bl{
display:block;
position:absolute;
top:250px;
right:595px;
opacity:0.8;
margin:0;
padding:5px;
}
#bj{
display:block;
position:absolute;
top:250px;
right:1265px;
margin:0;
padding:5px;
}
#bq{
display:block;
position:absolute;
top:250px;
right:595px;
margin:0;
padding:5px;
opacity:0.7;
}
#by{
display:block;
position:absolute;
top:600px;
right:610px;
margin:0;
padding:5px;
}
#bx{
display:block;
position:absolute;
top:250px;
right:740px;
margin:0;
padding:5px;
}
#bshop{
display:block;
position:absolute;
top:250px;
right:1114px;
margin:0;
padding:5px;
}
#bconst{
display:block;
position:absolute;
top:250px;
right:1220px;
margin:0;
padding:5px;
}
#bconstp{
display:block;
position:absolute;
top:530px;
right:1175px;
margin:0;
padding:5px;
opacity:0.9;
}
#bconstpp{
display:block;
position:absolute;
top:250px;
right:595px;
margin:0;
padding:5px;
opacity:0.9;
}
Форум
