Разместване на дйзаин...

M

Msecurity

Registered
Здравейте
Под различните браузъри и при различна резолюция сайта ми не прилича на напълно нищо... всичко се размества както си иска... :( Ето линкче на експериментчето ми: http://project.vw-bg.eu/
Ако някои каже как може да се оправи този проблем ще съм му много благодарен...
А ето и CSS:
[css]body{
background:#000000;
}
div.f1{
background-image: url(style/1.png);
background-repeat:no-repeat;
position:fixed;
width: 100%;
height: 100%;
top: 10%;
left:7.2%;
}

div.f2{
background-image: url(style/2.png);
background-repeat:no-repeat;
position:fixed;
left:20.7%;
bottom:10%;
top:10%;
width: 100%;
height: 100%;
}
div.f3{
background-image: url(style/3.png);
background-repeat:no-repeat;
position:fixed;
left:34.22%;
bottom:10%;
top:10%;
width: 100%;
height: 100%;
}
div.f4{
background-image: url(style/4.png);
background-repeat:no-repeat;
position:fixed;
left:50.8%;
bottom:10%;
top:10%;
width: 100%;
height: 100%;
}
div.f5{
background-image: url(style/5.png);
background-repeat:no-repeat;
position:fixed;
left:66.2%;
bottom:10%;
top:10%;
width: 100%;
height: 100%;
}
div.f6{
background-image: url(style/6.png);
background-repeat:no-repeat;
position:fixed;
left:79.2%;
bottom:10%;
top:10%;
width: 100%;
height: 100%;
}
div.f7{
background-image: url(style/7.png);
background-repeat:no-repeat;
position:fixed;
left:66.2%;
bottom:10%;
top:86.6%;
width: 100%;
height: 100%;
}
div.logo{
background-image: url(style/logo.png);
background-repeat:no-repeat;
position:fixed;
left:32.2%;
bottom:10%;
top:10.6%;
width: 100%;
height: 100%;
opacity:0.6;
}
div.fut{
background-image: url(style/fut.png);
background-repeat:no-repeat;
position:fixed;
left:18.8%;
bottom:10%;
top:79.4%;
width: 100%;
height: 100%;
opacity:1;
}
div.im1{
background-image: url(style/im1.png);
background-repeat:no-repeat;
position:fixed;
left:8.6%;
bottom:10%;
top:30.4%;
width: 100%;
height: 100%;
opacity:0.6;
}
div.im3{
background-image: url(style/im3.png);
background-repeat:no-repeat;
position:fixed;
left:68.4%;
bottom:10%;
top:30.4%;
width: 100%;
height: 100%;
opacity:0.6;
}
div.im2{
background-image: url(style/im2.png);
background-repeat:no-repeat;
position:fixed;
left:35.6%;
bottom:10%;
top:30.4%;
width: 100%;
height: 100%;
opacity:0.6;
}
div.news{
background-image: url(style/news.png);
background-repeat:no-repeat;
position:fixed;
left:25.0%;
bottom:10%;
top:51.4%;
width: 100%;
height: 100%;
opacity:1;
}
div.news-text{
background-color: #000000;
position:fixed;
left:26.7%;
bottom:10%;
top:53.4%;
width: 48.9%;
height: 22%;
opacity:0.5;
border-radius: 5px;
-moz-border-radius: 5px;
-khtml-border-radius: 5px;
-webkit-border-radius: 5px;
line-height: 1;
font-size: 1.8em;
color: #ffffff
}
div.im1-text{
background-color: #000000;
position:fixed;
left:8.6%;
bottom:10%;
top:30.4%;
width: 20%;
height: 20%;
opacity:1;
}
div.im2-text{
background-color: #000000;
position:fixed;
left:36.6%;
bottom:10%;
top:31.4%;
width: 29%;
height: 17%;
opacity:0.6;
}[/css]
 
Ем беше си подреден... когато го правих и много добре си се виждаше... но сега като седнах на друг комп. и с друг браузър... и му се *** майката... :(
 
Код: 
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>Untitled</title>
<meta http-equiv="content-type" content="text/html; charset=cp-2151">
<meta name="generator" content="Web Page Maker (unregistered version)">
<style type="text/css">
/*----------Text Styles----------*/
.ws6 {font-size: 8px;}
.ws7 {font-size: 9.3px;}
.ws8 {font-size: 11px;}
.ws9 {font-size: 12px;}
.ws10 {font-size: 13px;}
.ws11 {font-size: 15px;}
.ws12 {font-size: 16px;}
.ws14 {font-size: 19px;}
.ws16 {font-size: 21px;}
.ws18 {font-size: 24px;}
.ws20 {font-size: 27px;}
.ws22 {font-size: 29px;}
.ws24 {font-size: 32px;}
.ws26 {font-size: 35px;}
.ws28 {font-size: 37px;}
.ws36 {font-size: 48px;}
.ws48 {font-size: 64px;}
.ws72 {font-size: 96px;}
.wpmd {font-size: 13px;font-family: Arial,Helvetica,Sans-Serif;font-style: normal;font-weight: normal;}
/*----------Para Styles----------*/
DIV,UL,OL /* Left */
{
 margin-top: 0px;
 margin-bottom: 0px;
}
</style>

</head>
<body background="images/ava1.jpg" bgColor="#000000" style="background-repeat:no-repeat;background-position:top center;">
<div id="image1" style="position:absolute; overflow:hidden; left:292px; top:177px; width:170px; height:35px; z-index:0"><img src="images/butom.png" alt="" title="" border=0 width=170 height=35></div>

<div id="image2" style="position:absolute; overflow:hidden; left:470px; top:177px; width:167px; height:35px; z-index:1"><img src="images/butom.png" alt="" title="" border=0 width=167 height=35></div>

<div id="image3" style="position:absolute; overflow:hidden; left:644px; top:177px; width:167px; height:35px; z-index:2"><img src="images/butom.png" alt="" title="" border=0 width=167 height=35></div>

<div id="image4" style="position:absolute; overflow:hidden; left:824px; top:178px; width:167px; height:35px; z-index:3"><img src="images/butom.png" alt="" title="" border=0 width=167 height=35></div>

<div id="image5" style="position:absolute; overflow:hidden; left:1006px; top:179px; width:167px; height:35px; z-index:4"><img src="images/butom.png" alt="" title="" border=0 width=167 height=35></div>

<div id="image6" style="position:absolute; overflow:hidden; left:1191px; top:179px; width:167px; height:35px; z-index:5"><img src="images/butom.png" alt="" title="" border=0 width=167 height=35></div>

<div id="image7" style="position:absolute; overflow:hidden; left:335px; top:720px; width:961px; height:54px; z-index:6"><img src="images/foot.png" alt="" title="" border=0 width=961 height=54></div>

<div id="html1" style="position:absolute; overflow:hidden; left:269px; top:225px; width:353px; height:215px; z-index:7">
<script language="JavaScript">

</script>


<BODY bgcolor="#ffffff" text="#000000" link="#0000ff" vlink="#800080" alink="#ff0000" onload="SwitchPic(0)">


<img src="1.jpg" border="0" name="roll"></div>

<div id="text1" style="position:absolute; overflow:hidden; left:518px; top:515px; width:827px; height:143px; z-index:8">
<div class="wpmd">
<div><font color="#FFFFFF" face="@Adobe Fangsong Std R" class="ws72">Coming Soon</font></div>
</div></div>

<div id="text3" style="position:absolute; overflow:hidden; left:330px; top:178px; width:150px; height:33px; z-index:9">
<div class="wpmd">
<div><font color="#FFFFFF" class="ws20"><B>Начало</B></font></div>
</div></div>

<div id="text2" style="position:absolute; overflow:hidden; left:495px; top:178px; width:150px; height:33px; z-index:10">
<div class="wpmd">
<div><font color="#FFFFFF" class="ws20"><B>Събития</B></font></div>

</div></div>

<div id="text4" style="position:absolute; overflow:hidden; left:695px; top:178px; width:150px; height:33px; z-index:11">
<div class="wpmd">
<div><font color="#FFFFFF" class="ws20"><B>Меню</B></font></div>
</div></div>

<div id="text5" style="position:absolute; overflow:hidden; left:853px; top:179px; width:150px; height:33px; z-index:12">
<div class="wpmd">
<div><font color="#FFFFFF" class="ws20"><B>Галерия</B></font></div>
</div></div>

<div id="text6" style="position:absolute; overflow:hidden; left:1042px; top:181px; width:150px; height:33px; z-index:13">
<div class="wpmd">
<div><font color="#FFFFFF" class="ws20"><B>За нас</B></font></div>

</div></div>

<div id="text7" style="position:absolute; overflow:hidden; left:1218px; top:180px; width:150px; height:33px; z-index:14">
<div class="wpmd">
<div><font color="#FFFFFF" class="ws20"><B>Контакти</B></font></div>
</div></div>

<div id="text8" style="position:absolute; overflow:hidden; left:377px; top:728px; width:203px; height:90px; z-index:15">
<div class="wpmd">
<div><font color="#FFFFFF" class="ws14">All rights reserved!</font></div>
<div><font color="#FFFFFF" class="ws14">Avangard</font></div>
</div></div>

<div id="image8" style="position:absolute; overflow:hidden; left:638px; top:226px; width:401px; height:217px; z-index:16"><img src="images/5.jpg" alt="" title="" border=0 width=401 height=217></div>

<div id="image9" style="position:absolute; overflow:hidden; left:1059px; top:224px; width:344px; height:217px; z-index:17"><img src="images/5.jpg" alt="" title="" border=0 width=344 height=217></div>


</body>
</html>
 
Младеж... отивай на w3schools.org и почвай да учиш ХТМЛ и ЦСС от начало.

The <font> tag is deprecated in HTML 4, and removed from HTML5.
Прочети пак как се прави бокс модела. :)
Всичко най-
 
Като ти гледам позиционирането, нищо чудно, че имаш проблеми под различните браузъри и резолюции.
 
За един обикновен дизайн толкова много излишен код, при това в самия документ.
Според мен първо трябва да отделиш малко време върху CSS и как да го прилагаш ефективно, тогава да кодираш какъвто и да е било дизайн.
 
Трябва да си влезнал или регистриран, за да отговориш тук.

Back
Горе