PDA

View Full Version : سوال: مشکل با قالب سایت


milad_d993
دوشنبه 04 خرداد 1394, 20:24 عصر
سلام دوستان
یه قالب درست کردم
تا زمانی که اطلاعات درونش کمتر مساوی ارتفاع'ش هست مشکلی نداره ولی به محض اینکه اطلاعات زیاد میشه قالب به هم میریزه. (از min-height استفاده کردم)

http://uupload.ir/files/jfgm_2.png
http://uupload.ir/files/z3i8_1.png

اینم کد ها:
index.php


<!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 rel="stylesheet" href="style.css" />
</head>

<body dir="rtl">
<div class="main">
<div class="logo"></div>
<div class="menu">
<a href="index.php" class="active">صفحه اصلی</a>
<a href="password.php">تغییر گذرواژه</a>
<a href="loginOp.php?op=logOut">خروج</a>
</div>
<div class="content">
<div class="right">
<br />
&nbsp;مدیریت گیاهان
<ul>
<li><a href="plantList.php">لیست گیاهان</a></li>
<li><a href="plantAdd.php">درج گیاه جدید</a></li>
</ul>
<hr noshade="noshade">
&nbsp;آپشن ها
<ul>
<li><a href="arzesheGiyah/arzesheGiyahAdd.php">ارزش گیاه</a></li>
<li><a href="plantAdd.php">فرم رویشی</a></li>
<li><a href="plantAdd.php">طول دوره رشد</a></li>
</ul>
</div>
<div class="left">
</div>
</div>
<div class="footer">&copy; 2015</div>
</div>
</body>
</html>




فایل css:


@charset "utf-8";
/* CSS Document */
body
{
background-color:#F3F3F3;
font-family:tahoma;
}
.main
{
width:800px;
min-height:600px;
margin:auto;
box-shadow:0px 0px 25px #356618;
border-radius: 10px;

}
.logo
{
width:800px;
height:150px;
background-color:#356618;
border-radius: 10px 10px 0px 0px;
}
.menu
{
width:800px;
height:30px;
background-color:#4B4B4B;
text-align:right;
direction:rtl;
vertical-align:middle;
display:table-cell;
}

.content
{
width:800px;
min-height:350px;
background-color:#3CF;
}

.left
{
width:650px;
min-height:350px;
background-color:#FFFFFF;
float:left;
}

.right
{
width:150px;
min-height:350px;
background-color:#DCE9D4;
float:right;

}
.right hr
{
width:100px;
color:#B8D0AA;
size:100px;
}

.footer
{
width:800px;
height:70px;
background-color:#356618;
color:#FFFFFF;
font-size:15px;
text-align:center;
border-radius:0px 0px 10px 10px;
vertical-align:middle;
display:table-cell;

}
.menu a
{
color:#F0F2C9;
border-width:1px;
border-color:#003300;
border-style:outset;
border-radius:5px;
text-decoration:none;
padding:3px;
font-size:15px;
margin-right:5px;
margin-left:5px;
}
.menu a:hover
{
color:#356618;
background-color:#DAEAD0;
}

.active
{
background-color:#96B285;
}
li{
padding-bottom:10px;
color:#DCE9D4;
}
li a
{
color:#356618;
background-color:#DAEAD0;
border-width:1px;
border-color:#003300;
border-style:outset;
border-radius:15px;
text-decoration:none;
padding:3px;
font-size:15px;
margin-right:5px;
margin-left:5px;
}
li a:hover
{
color:#F0F2C9;
background-color:#4B4B4B;
}
abdorreza
دوشنبه 04 خرداد 1394, 23:12 عصر
مشکل شما اینه که دیو های right و left رو تو دیو content ساختی و وقتی تو content چیزی مینویسی به هم میخوره.

یک دیو دیگه تو content تعریف کن برای قرار دادن محتوا
milad_d993
دوشنبه 04 خرداد 1394, 23:40 عصر
div کانتنت رو حذف کردم ولی مشکل حل نشد؛ میشه کد رو برام اصلاح کنین :خجالت:
abdorreza
دوشنبه 04 خرداد 1394, 23:51 عصر
ببین شما نباید دیو content رو حذف کنی

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

حل نشد بگو چشم
milad_d993
چهارشنبه 06 خرداد 1394, 16:35 عصر
حل نشد :(:افسرده::افسرده::افسرده:
milad_d993
چهارشنبه 06 خرداد 1394, 22:32 عصر
میخوام اینو درست کنم:
131720
H:Shojaei
چهارشنبه 06 خرداد 1394, 22:57 عصر
خوب دقیقا همین هایی که گفتید خودشون میشن هرکدوم یک دایو یک دایو هدر یکی منو
یکی واسه کانتنت که دو دایو سمت راست و سمت چپ تو اون قرار میکیرن و یک دایو هم فوتر
اسکلتش به این صورت میشه:


<div class='header' style='width:100%;'></div>

<div class='menu' style='width:100%;'></div>

<div class='content' style='width:100%;'>
<div class='left-content' style='float:left;width:80%;'></div>
<div class='right-content' style='float:right;width:19%;'></div>
</div>

<div class='footer' style='width:100%;'></div>
abdorreza
چهارشنبه 06 خرداد 1394, 23:35 عصر
سلام

این فایل رو دانلود کن و ببین

یه CSS دادم بهش که قسمت های مختلف رنگی باشه و معلوم. امیدوارم به دردت بخوره
hamedarian2009
چهارشنبه 06 خرداد 1394, 23:35 عصر
سوالتون رو در بخش طراحی وب بپرسید اینجا بخش PHP است
milad_d993
پنج شنبه 07 خرداد 1394, 08:57 صبح
نشد نشد نشد
131730
دانیال دزفولی
پنج شنبه 07 خرداد 1394, 10:36 صبح
به دیو مادر

overflow:hidden بده
mohammad425
پنج شنبه 07 خرداد 1394, 11:46 صبح
نشد نشد نشد
http://barnamenevis.org/attachment.php?attachmentid=131730&d=1432789044


1.در کد آقای abdorreza به جای height از min-height استفاده کنید.
2.قبل از
<div id="footer"> از این کد استفاده کنید:
<div style="clear: both"></div>
asghar2008
پنج شنبه 07 خرداد 1394, 21:57 عصر
سلام

در کدهای که خودت آپلود کرد

قسمت css کانتنت (content) به صورت زیر بنویس


.content
{
width:800px;
overflow:auto;

}

ب همین سادگی..
sabagch
شنبه 09 خرداد 1394, 08:33 صبح
من یه فایل آموزشی از سایت حامی پروزه www.hamiproje.com (http://hamiproje.com) دانلود کردم که طراحی قالب سایت رو خیلی خوب آموزش داده بود. خودم خیلی با DIV مشکل داشتم اما کامل مشکلم برطرف شد.
Hosein128
شنبه 09 خرداد 1394, 11:27 صبح
faghat kafie in taghirato update koni ru projat: (age bazam hal nashod begu rahnamaeit konam)


.content{
display:inline-block;
}
.right
{
display:inline-block;
}

.left
{
display:inline-block;
}