کمک در طراحی قالب

[mmfallah 67]

سلام

من دارم یه psd را به قالب تبدیل می کنم یه سری مشکلات دارم. از استید طراح تقاضای کمک دارم.

1. توی عکس اول نشون دادم. یه موقعیت را توش منو فراخونی کردم منو ها به هم چسبیدن. نمی دونم کد css اش چیه که بینشون فاصله بیفته.

2. قسمت سرچ را نگاه کنید وقتی صفحه را بزرگ یا کوچیک می کنم جابجا می شه و ثابت نمی مونه

از این کد ها استفاده کردم تو css

#search{
position:absolute;
width:520px;
height:85px;
right:203px;
top:130px;
background-image:url(../images/sss.png);
background-position:left;
background-repeat:no-repeat;

}
#search1{
position:absolute;
width:200px;
height:30px;
right:223px;
top:30px;
background-color:#F00;
}

3. برای اینکه ستون های سمت راست و چپ مساوی و یک اندازه بشه باید از کد clear استفاده کنیم که روش استفادش را نمی دونم.

لطفا توضیح دهید

با تشکر

ویرایش شده در آذر 91 توسط mmfallah

[Abbas_Afshar 15]

سلام.

برای ساختن منوهات یه سری به لینک زیر بزن، همه چیزو گفته:

http://docs.joomla.org/Creating_a_CSS_Drop_down_Menu

برای جستجوت اول باید یه کادر با div درست کنی و تمام اجزای قالبت رو توی اون تعریف کنی و اسمش رو مثلا بزاری main مثله کد زیر:

<div id="main">

<div id="header"></div>

<div class="clear" style="clear: both;"></div>	

<div id="search"></div>

<div class="clear" style="clear: both;"></div>	

<div id="main-body">
	<div id="left"></div>
	<div id="content"></div>
	<div id="right"></div>
</div>

<div class="clear" style="clear: both;"></div>	

<div id="footer"></div>
</div>

اینطوری وقتی به main استایل بدی و عرض و ارتفاع اونو مشخص کنی، موقعیت جستجو از اون بیرون می زنه.

در ضمن کد position:absolute رو پاک کن.

سوال آخرت هم در رابطه با کد clear بود که در دستورات آوردمش. البته بجای both می تونی از left و right هم استفاده کنی

که باعث می شه از چپ و راست بریزه پایین ولی both از هر دو طرف می ریزه پایین.

[Abbas_Afshar 15]

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

"موقعیت جستجو از اون بیرون نمی زنه".

موفق باشید:128fs318181:

[mmfallah 67]

من تو اینکسم از این کد استفاده کردم

[

<div id="daryaweb">
<div id="head">
<div id="header"></div><!--end of header-->
<div id="menub">

<div id="menu"><jdoc:include type="modules" name="menu" style="none" />
</div><!--end of menub-->
<div id=" fnews">
<jdoc:include type="modules" name="flashnews" style="none" />
</div><!--end of flashnews-->

<div id="date"><?php echo 'امروز:' ?>	
 <?php echo JHTML::_('date', 'now' ) ?> 
</div><!--end of date-->
</div><!--end of head-->
</div><!--end of menub-->

<div id="container">
<div id="left"><jdoc:include type="modules" name="left" style="none" />
</div><!--end of right-->

<div id="container1">
<div id="search">
<div id="search1"><jdoc:include type="modules" name="search" style="none" />
</div>
</div>
</div><!--end of search-->

<div id="content"> <jdoc:include type="component" />
</div><!--end of component-->
</div><!--end of container1-->

<div id="right"><jdoc:include type="modules" name="right" style="none" />
</div><!--end of right-->
</div><!--end of container-->

   <div class="clear" style="clear"; both;"></div>  

</div><!--end of daryaweb-->

در مورد منو هم نتونستم چیزی از اون لینک در بیارم که چطور بینشون فاصله بدم

کد clear را هم اینجوری استفاده کردم تغییری نکرد

وقتی هم position:absolute را بر میدارم موقعیت سرچ سر جاش نمی مونه.

[mdchicho 11]

با سلام

در مورد منو با فرض اینکه منوی شما در div به نام NAV باشد از این کدها استفاده کنید.

#nav li {
margin: 0 5px;
padding: 0 0 8px;
float: right;
position: relative;
list-style: none;
}

اگر مشکلتون حل نشد بگید براتون نمونه آپلود کنم. موفق باشید.

[joom 11]

سلام دوست من

نگاه کن من هم دقیقا مشکل شما رو داشتم...

پیشنهاد من این هست که یک بار آموزش های طراحی سایت، سایت جومدیا رو نگاه کنید مشکلتون بر طرف میشه....

تا الان 6 قسمت آموزش داره که به گفته سایتشونن ادامه داره آموزش ها ...

قسمت اول

بقیه قسمت هاش رو هم میتونی تو سایتشون یه سرچ کنی پیدا میکنید:128fs318181:

ویرایش شده در آذر 91 توسط joom
اصلاح لینک های آموزش