تب ساز راست چین کسی داره؟

[amir101]

سلام
من یه تب ساز ساده می خوام که بتونهاز مجموعه مطالب تب بسازه
یعنی مثلا اگه توی مجموعه مطالب 5 تا مطلب هست اونا رو کنار هم بزاره و راست چین باشه
کسی چیزی سراغ داره؟

[amir101]

دیدن لینک ها برای شما امکان پذیر نیست. لطفا ثبت نام کنید یا وارد حساب خود شوید تا بتوانید لینک ها را ببینید.

ممنون

[Reza Ganji]

دوست عزیز دمو سایت خودتون رو باید قرار دهید نه سایت سازنده.

[amir101]

دیدن لینک ها برای شما امکان پذیر نیست. لطفا ثبت نام کنید یا وارد حساب خود شوید تا بتوانید لینک ها را ببینید.

---

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

[heroesofnew]

css های تب سازتون را پیوست کنید تا براتون راست چین کنم

[amir101]

کد: (انتخاب همه)

/**
* Global Qlue Tabs Styles
* Author: Dan Humphries
* Date: 9/6/2011
* Design: Default
* Copyright: Qlue 2011
*/
#qlue-tabs{
    margin: 10px 0;
    display: block;
    overflow: hidden;
}
#tabContentContainer { background: #FFF; }
.tabContent { background: #FFF;    color: #000; overflow: auto; }
.tabContentSlide {background: #FFF; color: #000; overflow: hidden; }
.tabContent-inner{
    padding: 10px 15px;
    margin: 0;
    text-align: justify;
}

/* Stop screen.css from indenting multiple p tags */
.tabContent-inner p + p { text-indent: 0; margin: 0; }

.show { display: block; }
.hide { display: none; }

/**
* Tab Styles for Normal Layout
* Author: Dan Humphries
* Date: 9/6/2011
* Copyright: Qlue 2011
*/
#tabHeader {
    margin: 0 0;
    padding: 0;
    overflow: hidden;
    display: block;
}
#tabHeader ul{
    margin: 0;
    padding: 0;
    list-style: none;
    overflow: hidden;
    display: block;
}
#tabHeader ul > li { background: none; padding: 0; margin; 0; }
#tabHeader ul > li > a {
    margin: 0 5px 0 0;
    padding: 5px 20px;
    float: left;
    text-decoration: none;
}
#tabHeader ul > li > a:hover { text-decoration: underline; }
/**
* Normal Style
*
* Author: Dan Humphries
* Date: 10/6/2011
* Layout: Normal
*/
.normal #tabContentContainer {
    margin-top: -1px;
    background: #FFF;
    border: 1px solid #CCC;
    border-top-right-radius: 10px;
    border-bottom-right-radius: 10px;
    border-bottom-left-radius: 10px;
}
.normal .tabContent, .normal .tabContentSlide {
    color: #000;
    overflow: auto;
    border-top-right-radius: 10px;
    border-bottom-right-radius: 10px;
    border-bottom-left-radius: 10px;
}
.normal .tabContentSlide { overflow: hidden !important; padding: 0; margin; 0; overflow: hidden; }
.normal #tabHeader ul > li > a {
    margin: 0px 5px 0 0;
    padding: 8px 15px;
    float: left;
    text-decoration: none;
    border: 1px solid #CCC;
    border-bottom: none;
}
.normal #tabHeader ul > li:first-child a{ border-top-left-radius: 10px; }
.normal #tabHeader ul > li:last-child a{ border-top-right-radius: 10px; }
.normal #tabHeader .active{
    border-bottom: 1px solid #FFF !important;
    background: #FFF;
    color: #000;
}
.normal #tabHeader .active:hover { color: #000; }
.normal #tabHeader .inactive{ background: #CCC; color: #FFF;}
.normal #tabHeader .inactive:hover { background: #DDD !important; color: #FFF !important; }

[vahid.exe]

سلام.

در فایل style.css کدهای زیر را در خط 78 پیدا کنید و floatLleft; را به floate:right; تغییر بدید تا تب ها راست چین شود.

کد: (انتخاب همه)

{
    margin: 0px 5px 0px 0px;
    padding: 8px 15px;
    float: left;
    text-decoration: none;
    border-width: 1px 1px medium;
    border-style: solid solid none;
    border-color: #CCC #CCC -moz-use-text-color;
    -moz-border-top-colors: none;
    -moz-border-right-colors: none;
    -moz-border-bottom-colors: none;
    -moz-border-left-colors: none;
    border-image: none;
}

برای حاشه های اولین تب و آخرین دونه. کدهای زیر را در فایل style.css پیدا کنید و مقدارش را ویرایش کنید.

کد: (انتخاب همه)

.normal #tabHeader ul > li:last-child a {
    border-top-right-radius: 10px;
}

کد: (انتخاب همه)

.normal #tabHeader ul > li:first-child a {
    border-top-left-radius: 10px;
}

در کد اول right رو به left و در کد دوم left را به right تغییر دهید تا حاشیه ها درست شود.


یا علی

[heroesofnew]

سلام

ببخشید نبودم

کد را براتون به صورت استاندارد راست چین کردم

موفق باشید

کد: (انتخاب همه)

body {
    direction: rtl;
}
/**
* Global Qlue Tabs Styles
* Author: Dan Humphries
* Date: 9/6/2011
* Design: Default
* Copyleft: Qlue 2011
*/
#qlue-tabs{
    margin: 10px 0;
    display: block;
    overflow: hidden;
}
#tabContentContainer { background: #FFF; }
.tabContent { background: #FFF;    color: #000; overflow: auto; }
.tabContentSlide {background: #FFF; color: #000; overflow: hidden; }
.tabContent-inner{
    padding: 10px 15px;
    margin: 0;
    text-align: justify;
}

/* Stop screen.css from indenting multiple p tags */
.tabContent-inner p + p { text-indent: 0; margin: 0; }

.show { display: block; }
.hide { display: none; }

/**
* Tab Styles for Normal Layout
* Author: Dan Humphries
* Date: 9/6/2011
* Copyleft: Qlue 2011
*/
#tabHeader {
    margin: 0 0;
    padding: 0;
    overflow: hidden;
    display: block;
}
#tabHeader ul{
    margin: 0;
    padding: 0;
    list-style: none;
    overflow: hidden;
    display: block;
}
#tabHeader ul > li { background: none; padding: 0; margin; 0; }
#tabHeader ul > li > a {
    margin: 0 0 0 5px;
    padding: 5px 20px;
    float: right;
    text-decoration: none;
}
#tabHeader ul > li > a:hover { text-decoration: underline; }
/**
* Normal Style
*
* Author: Dan Humphries
* Date: 10/6/2011
* Layout: Normal
*/
.normal #tabContentContainer {
    margin-top: -1px;
    background: #FFF;
    border: 1px solid #CCC;
    border-top-left-radius: 10px;
    border-bottom-left-radius: 10px;
    border-bottom-right-radius: 10px;
}
.normal .tabContent, .normal .tabContentSlide {
    color: #000;
    overflow: auto;
    border-top-left-radius: 10px;
    border-bottom-left-radius: 10px;
    border-bottom-right-radius: 10px;
}
.normal .tabContentSlide { overflow: hidden !important; padding: 0; margin; 0; overflow: hidden; }
.normal #tabHeader ul > li > a {
    margin: 0px 0 0 5px;
    padding: 8px 15px;
    float: right;
    text-decoration: none;
    border: 1px solid #CCC;
    border-bottom: none;
}
.normal #tabHeader ul > li:first-child a{ border-top-right-radius: 10px; }
.normal #tabHeader ul > li:last-child a{ border-top-left-radius: 10px; }
.normal #tabHeader .active{
    border-bottom: 1px solid #FFF !important;
    background: #FFF;
    color: #000;
}
.normal #tabHeader .active:hover { color: #000; }
.normal #tabHeader .inactive{ background: #CCC; color: #FFF;}
.normal #tabHeader .inactive:hover { background: #DDD !important; color: #FFF !important; }