رفتن به مطلب

مشکل در قسمت طراحی SideBar


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

سلام دوستان

من الان دارم یه پوسته ایی طراحی میکنم قسمت سایدبار رسیدم وقتی من به کلاس متنم float میدم از div خارج میشه ، دلیلش چیه ؟

شات وقتی که float ندادم : http://up.vbiran.ir/uploads/8734140187155510382_1.png

شات از وقتی که بهش float دادم : http://up.vbiran.ir/uploads/34538140187155541446_2.png

کدهای php :


<div class="side">
<div class="title-side">
<div class="txt-side">
تست
</div>
<div class="ico-side">
<span class="livicon" data-n="tag" data-s="22" data-c="#ecf0f1" data-hc="#bdc3c7" data-a="1" data-l="0" data-i="3" data-d="0" data-et="hover" data-op="0"></span>
</div>
</div>
<div class="text-side">
<li><a href="#">تست موضوع</a></li>
</div>
</div>
</div>

کدهای css :


/** sidebar **/
.side { width:100%; height:auto; background-color:#FFF; border: solid 1px #CCC; border-radius: 2px;}
.title-side { width:95%; height:30px; background-color:#3498db; margin-top:5px; box-shadow: 0 -4px 0 rgba(0, 0, 0, 0.08) inset;}
.txt-side { width:auto; height:30px; float:right; margin:6px; color:#FFF;}
.ico-side { width:auto; height:30px; float:left; margin:6px;}
.text-side { width:95%; height:auto; float:right; margin-right:7px;}
.text-side li {margin-right: 15px; color:#3498db; }
.text-side li a { color:#2980b9;}

لینک به ارسال

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

.side .text-side li {
float:right ;
}

موفق باشی دوسته عزیز :)

جواب نداد :)

لینک به ارسال

شما flot:right کلاس text-side رو بردار و به li بده ... کد نویسیت یکم اشتباهه

برداشته بودم همینطوری که گفتید انجام دادم ولی جواب نداد :)

لینک به ارسال

این استایل مگه مال سایدبار نیست؟

چرا به لایه ها float دادید مگه قرار نیست ستون کناری به صورت ستونی باشه ؟

یا اگه nav menu دارید می سازید یا فهرست خوابیده همونطور که فرمودند float را بردارید بجاش به تگ li


display: inline-block;

بدید و به تگ a خاصیت


display: block;

لینک به ارسال

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

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

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

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

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

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

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

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

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