ورود

View Full Version : سوال: فوری :بهم ریختن صفحات وب سایتم بعد از استفاده از منوی عمودی


SONITAJ
پنج شنبه 19 اردیبهشت 1392, 17:52 عصر
سلام
من یک منوی عمودی ساختم ودر سمت راست صفحات وب سایتم استفاده کردم.ولی وقتی منو را در صفحاتم میزارم مثل عکس زیر بهم میریزه یعنی عکسی که توی صفحه ام دارم میره زیر منو در صورتی که من میخواهم سمت چپ منو قرار بگیره .وقت منو را برمی دارم درست میشه ولی وقتی منو را میزارم نه چرا؟ باید چه جوری تنظیم ودرستش کنم .لطفا من را راهنمایی کنید.
عکس اول بدون منو هست
103946
عکس دوم با منو هست :
103948
اینم کد css منو:

#menu a,#menu a:visited{
text-align:center;
text-decoration:none;
color:#000000;
display:block;
width:8em;
height:1.25em;
border:0.5em solid #fff;
font-family:Arial;
font-size:15px;
}
#menu a:hover{
color:#fff;
background-color:#b2ab9b;
border-color:#dfd7ca #b2ab9b;
}
لطفا راهنمایی کنید؟از خاصیت floatدر css اسفاده کردم ولی تنظیم نشدچه مواردی ازcss را برای استایل دهی به عکس که سمت چپ منو قرار بگیره استفاده کنم .لطفا برای من با یک مثال کوچک توشیح دهید وراهنمایی کنید.
سعید کشاورز
پنج شنبه 19 اردیبهشت 1392, 18:18 عصر
هم عکس و هم منو رو توی یه Div قرار بده..به منو Float : right و به عکس Float:left نسبت بده
SONITAJ
یک شنبه 05 خرداد 1392, 22:49 عصر
سلام
من اومدم کد را به صورت زیر تغییر دادم و منوی عمودی و عکس اون طوری که میخواستم درست شد ولی متنهایی که میخواهم بعداز عکس قرار بگیره اومده روی عکس قرار گرفته ونمیدونم چه طوری تنظیمش کنم (اینم عکسش).لطفا راهنمایی کنید.
این عکس :
104699
این کدم

<?php
ob_start();
require_once 'config.php';
require_once 'header.php';
require_once 'db.php';
?>
<!doctype html>
<html dir="rtl">
<head>
<meta charset="utf8"/>
<title><?php echo TITR;?></title>
<style type="text/css"/>
.sidebar{
width:8em;
height:auto;
float:right;
margin:5px;
}
.m a {
text-align:right;
direction:rtl;
text-decoration:none;
padding:4px;
color:#000000;
display:block;
width:8em;
height:1.25em;
border:solid 3px #fff;
font-family:Arial, Helvetica, sans-serif;
font-size:15px;
font-weight:bold;
margin:0px;
float : right;
}
.sidebar a:hover{
color:#fff;
background-color:#b2ab9b;
border-color:#dfd7ca #b2ab9b;
}
.content{
padding:12px;
margin:15px;
width:100px;
height:60px;
float:right;
}
.text{
font-size:30px;
float:right;
margin-top:10px;
padding:40px;
}
</style>

</head>
<body>

<div id="wrapper">
</div>

<div id="container">

<div class="sidebar">
<div class="m"><a href="index.php">صفحه اصلی</a></div>
<div class="m"><a href="ajori.php">طرح آجري</a></div>
<div class="m"><a href="pazel.php">طرح پازل</a></div>
<div class="m"><a href="hasir.php">طرح حصیری</a></div>
<div class="m"><a href="gheychi.php">طرح قیچی</a></div>
<div class="m"><a href="namonazam.php">طرح نامنظم</a></div>
<div class="m"><a href="kharej.php">نمای خارجی</a></div>
<div class="m"><a href="dakhel.php">نمای داخلی</a></div>
<div class="m"><a href="kaf.php">نمای کف</a></div>
<div class="m"><a href="factory.php">درباره کارخانه</a></div>
<div class="m"><a href="manager.php">درباره مسولان</a></div>
<div class="m"><a href="kharid.php">راهنمای خرید</a></div>
<div class="m"><a href="pardakht.php">راهنمای پرداخت</a></div>
<div class="m"><a href="contact.php">ارتباط با ما</a></div>
<div class="m"><a href="support.php">پشتیبانی</a></div>
<div class="m"><a href="form.php">فرم سفارش</a></div>
<div class="m"><a href="peygiri.php">پیگیری سفارش</a></div>
</div>

<div class="content">
<a href="#"><img src="images/ajori/ajori1.jpg" alt="Keivan Stone" ></a>

</div>


</div>
<div class="text">
طرح آجری
</div>

</body>
</html>

<?php
ob_end_flush();
?>
توی کدهایی cssام کجا را اشتباه نوشتم یا ننوشتم که اینجوری میشه .:متفکر::ناراحت:
لطفا راهنمایی کنید.
ممنونم
moalla
یک شنبه 05 خرداد 1392, 23:46 عصر
راستش یکم گنگ نوشتین. کاش توی فتوشاپ ساده درمیاوردین که چه چینشی مدنظر نهایی شماست و تو کجاش مشکل دارین. بهرحال یه آموزش اینجاست (http://quicklearn.ir/?q=node/35)
در مورد چیدمان عمودی و افقی توضیح دادم نگاه کنید فکر میکنم دستتون بیاد
SONITAJ
دوشنبه 06 خرداد 1392, 11:37 صبح
سلام
ببخشید کجای این کد مبهم است؟من میخواهم قسمت وسط را که شما توی آموزشتون به سه قسمت تقسیم کردید قسمت چپ و راست را مثل عکس به صورت حاشیه نگه دارم وقسمت وسط این دو را به 3قسمت تقسیم کنم .مثل عکس بالا که اول منوی عمودی بعد عکس و بعد از اون هم مطالب مربوط به عکس را توی وب سیتم بگذارم .میخواهم توی صفحات وب سایتم انکار را انجام بدهم .قالب وب سایتم نیست .لطفا اگر می تونید راهنمایی کنید.اگر قبل ار متن طرح آجری از&nbsp; دوازده بار استفاده کنم متن از روی عکس میاد کنار عکس دنبال یک روش بهتر می گردم که نخواهم اون را مداوما ببنویسم.
moalla
دوشنبه 06 خرداد 1392, 11:52 صبح
<div>
<div>
<img src="images/ajori/ajori1.jpg" alt="">
</div>
<div>طرح آجری</div>
</div>
SONITAJ
دوشنبه 06 خرداد 1392, 23:05 عصر
با روش بالا که شما فرمودید متن زیر عکس قرار میگیره من میخواهم متن سمت چپ عکس قرار بگیره و از روی عکس بره کنار وبغل عکس باشه چه کاری باید انجام دهم؟ روش دیگه ایی وجود نداره؟لطفا اگر کسی بلده راهنمایی کنه. ممنونم
moalla
دوشنبه 06 خرداد 1392, 23:18 عصر
دوست من آخه چرا یه دور آموزشی که گذاشتم رو نگاه نمیکنی؟
چیزی که خواستید رو اینجا (http://jsfiddle.net/moalla/mzxpt/)درست کردم