وضعیت قالب در حالت restore down

shayan · مرداد 92

سلام

من تازه با طراحی سایت آشنا شدم و اطلاعات زیادی تو این ضمینه ندارم

دارم یه قالب طراحی میکنم که به این مشکل بر خوردم

اینه که وقتی پنجره مرورگر در حالت عادی هست قسمت های مختلف سایت سر جاشون هستند ولی وقتی مرورگر یه خورده کوچک تر میشه

یعنی همون restore down میشه

قالب به هم میریزه و جاشون تغییر میکنه

میخواستم بدونم چیکار باید کرد تا به هیچ عنوان این اشکال و قسمت ها از جاشون تکون نخوردن

تحت هیچ شرایطی

کد هام رو هم میزارم ببینید مشکل از کجاشه

HTML


<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>انصار الصلاة</title>
<link href="style.css" rel="stylesheet" type="text/css" />
</head>
<body>
<!..............header...............!>
<div id="header">
<a href="#"> <img src="header.gif" width="277" height="55" /></a>
</div>
<br/>
<br/>
<br/>
<br/>
<!...................................!>
<div id="doa">
<!......................NAV...........!>
<div id="nav">
<ul class="menu">
<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>
<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>
<br/>
<!...........................doa...............!>
<p style="font-family:'Adobe Arabic'; color:black;" >
<marquee direction="right" behavior="scroll" >
اَللّهُمَّ كُنْ لِوَلِيِّكَ الْحُجَّةِ بْنِ الْحَسَنِ صَلَواتُكَ عَلَيْهِ وَعَلى آبائِهِ في هذِهِ السّاعَةِ وَفي كُلِّ ساعَةٍ وَلِيّاً وَحافِظاً وَقائِداً وَناصِراً وَدَليلاً وَعَيْناً حَتّى تُسْكِنَهُ أَرْضَكَ طَوْعاً وَتُمَتِّعَهُ فيها طَويلا
</marquee>
</p>
</marquee>
<!....................time.................!>
</div>
<div id="time">
</div>
<br/>
<div class="sidebar">
</div>
<br/>
<br/>
<br/>
<div class="sidebar-menu">
</div>
</body>
</html>

CSS


body{
background:url(bg.gif);
}
#header{
float:right;
margin-top:20px;
margin-right:80px;
}
#doa{
width: 1000px;
height: 35px;
background-color:#2abbea;
float:right;
    margin-right:80px;
}

.menu {
direction:rtl;
margin-top:50px;
list-style:none;
margin:-25px;
   margin-right:300px;
}

.menu li{
display:inline-block;
width:auto;
line-height:27px;
height:27px;
overflow:visible;
position:relative;
bottom:0;
}
.m2 li {
margin-left:3px;

}
.menu li a {
position:relative;
display:block;
padding:3px;
height:21px;
background:#2abbea;
    background-image: -webkit-gradient(linear, top right, bottom left, from(#2abbea), to(#2abbea));
    background-image: -webkit-linear-gradient(top, #2abbea, #2abbea);
    background-image:    -moz-linear-gradient(top, #2abbea, #2abbea);
    background-image:	  -o-linear-gradient(top, #2abbea, #2abbea);
    background-image: linear-gradient(to bottom, #2abbea, #2abbea);
bottom:0;
margin:0;
top:0;
zoom: 1;
text-decoration:none;
-moz-transition: all 0.3s ease-out; 
-o-transition: all 0.3s ease-out; 
-webkit-transition: all 0.3s ease-out; 
transition: all 0.3s ease-out; 
color:#000;
}
.menu li a:hover {
height:31px;
top:-10px;
}
#time{
width: 180px;
height: 35px;
background-color:#2abbea;
float:right;
margin-right:5px;
  margin-left:80px;
position:relative;
}
.sidebar{
width: 240px;
height: 23px;
background-color:#2abbea;
float:right;
margin-top:12px;
margin-right:80px;
border-radius:10px;
  }
.sidebar-menu{
width: 240px;
height: 261px;
background-color:#0e97c3;
float:right;
margin-right:80px;
border-radius:10px;

پیشاپیش ممنون از کمکتون

Farid · مرداد 92

سلام

هیچ راهی وجود نداره که همونجور بمونن ! شما باید طرحت رو رسپانسیو بزنی که با عرض مرورگر طرح هم عوض شه و یا اینکه عناصر صفحه کمی کوچکتر بشن // با توجه به این خودتون میگید تازه با طراحی آشنا شدید ، خیلی سخته براتون که طراحی رسپانسیو یاد بگیری

shayan · مرداد 92

دوستان دیگه راه حل بهتری ندارند من از شر این قالب راحت شم؟؟؟؟؟

تو css چیزی نیست که این کار رو انجام بده؟؟

**Morteza** · مرداد 92

میتونید آدرس سایت رو بدید؟

shayan · مرداد 92

نه متاسفانه

رو لوکال هاست کار میکنم

کد ها رو همشو گذاشتم

**Morteza** · مرداد 92

خوب این کد کلا تا یه حد مشخصی درست نشون میده و عادی هست

اگر میخواین روی هر رزولیشینی درست بشه همونطور که گفته شده باید ریسپانسیو بشه

shayan · مرداد 92

چجوری باید این کار رو انجام بدم داداش؟؟

**Morteza** · شهریور 92

خوب آموزشهای زیادی توی نت هست

یکی رو مطالعه کنید

ورود

وضعیت قالب در حالت restore down

پست های پیشنهاد شده

shayan 116

لینک به ارسال

Farid 2281

لینک به ارسال

shayan 116

لینک به ارسال

Morteza 34190

لینک به ارسال

shayan 116

لینک به ارسال

Morteza 34190

لینک به ارسال

shayan 116

لینک به ارسال

Morteza 34190

لینک به ارسال

به گفتگو بپیوندید

فهرست بخش ها

فعالیت ها