رفتن به مطلب

ثابت ماندن منو با اسکرول صفحه


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

سلام من ی منو ساختم به این صورت حالا وقتی بهش position : fixed میدم یکم بهم میریزه و وقتی اسکرول رو پایین میارم به بالا نمیچسبه و ی فاصله ای داره به این صورت :

menu.JPG

باید چیکار کنم که کد ها بهم نریزه و خیلی منظم با پایین آوردن اسکرول بره بالا بچسبه ؟؟

اینم کد های منو :

این html

<div class="middle">
<div class="upnews">برای درسترسی ب تمام بخش های سایت از منو ها استفاده کنید</div>
<div class="menu">
<ul>
<li><a href="#">قالب</a></li>
<li><a href="#">کد سایت</a></li>
<li><a href="#">گرافیک</a></li>
<li><a href="#">گالری</a></li>
<li><a href="#">انجمن</a></li>
</ul>
<form>
<input type="text" name="" placeholder="جستجو کنسد" />
<input type="submit" name="" value="" />
</form>
</div>
</div>

اینم css

.middle{width:1024px ;  margin:0px auto; position:relative ;}
.upnews{padding: 7px 15px;
color: #FFF;
background: #e74c3c;}
.menu{ background:url(images/menu.jpg) ; width:100% ; height: 56px;
margin: -14px 0px;}
.menu ul{list-style-type:none;}
.menu ul li{float: right;
margin: 17px 17px 0px 0px; }
.menu ul li a{color: #fff;
text-decoration: none; font-size: 14px;
padding: 2px 10px; -webkit-transition:0.3s; border-radius:8px}
.menu ul li a:hover {
background: #3498db;
box-shadow: 0px 2px 2px #000; }
.menu input[type=text]{float: left;
margin: 12px 38px;
background: #cbcbcb;
padding: 2px 16px; font-family:WYekan ; border: solid 2px #8c8c8c; }
.menu input[type=submit]{background: url(images/search-icon.jpg);
width: 31px;
height: 24px;
position: absolute;
left: 40px;
top: 47px;
border: none;}

ممنون که وقت گذاشتید و مطلبمو خوندید

تشکر

لینک به ارسال

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

هم اکنون می توانید مطلب خود را ارسال نمایید و بعداً ثبت نام کنید. اگر حساب کاربری دارید، برای ارسال با حساب کاربری خود اکنون وارد شوید .

مهمان
ارسال پاسخ به این موضوع ...

×   شما در حال چسباندن محتوایی با قالب بندی هستید.   حذف قالب بندی

  تنها استفاده از 75 اموجی مجاز می باشد.

×   لینک شما به صورت اتوماتیک جای گذاری شد.   نمایش به صورت لینک

×   محتوای قبلی شما بازگردانی شد.   پاک کردن محتوای ویرایشگر

×   شما مستقیما نمی توانید تصویر خود را قرار دهید. یا آن را اینجا بارگذاری کنید یا از یک URL قرار دهید.

×
×
  • اضافه کردن...