مرجع پارسی MyBB

نسخه‌ی کامل: مشکل در تغییر عرض انجمن
شما درحال مشاهده‌ی نسخه‌ی متنی این صفحه می‌باشید. مشاهده‌ی نسخه‌ی کامل با قالب‌بندی مناسب.
درود بر همگی.عرض انجمن من واسه مانیتورهای عریض کمه و من تصمیم دارم رسپونسیوش کنم.تو global.css بلوک container عرض پیشفرض 950 هستش و من به 1200 تغییرش دادم اما مشکلی که هست قالب به یه سمت متمایل می شه و دیگه وسط نیست.در واقع با تغییر عرض یه فاصله ثابت از سمت راست صفحه داره.لطفا راهنمایی کنید

اینم کد global.css

کد:
/***************************************
    Nesil 1.0
    soniquake - huseyinemanet.com - hsynemanet@gmail.com
    RTL by P30-Art.Ir
    09 Aralik 2010 Persembe
    ie7, ie8, ff, opera, chrome, safari
***************************************/

body {
    background: #d0d1c9 url(images/nesil/arkaplan.jpg) repeat;
    color: #333;
    font-family: Tahoma, Verdana, Arial, Sans-Serif;
    font-size: 12px;
    text-align: center;
    line-height: 1.6;
    margin: 0 0 25px 0;
}

a:link, a:visited {
    color: #1359AE;
    text-decoration: none;
    outline: 0;
}

a:hover, a:active {
    color: #C62222;
    text-decoration: none;
    outline: 0;
}

#container {
    background: #fff;
    width: 950px;
    color: #333;
    border: 1px solid #5d5d5d;
    border-top: 0;
    margin: 0 auto;
    text-align: right;
}

#content {    
        width: auto !important;
    padding: 15px 20px;}

#panel {
    background: #efefef;
    color: #000;
    font-size: 11px;
    border: 1px solid #D4D4D4;
    padding: 8px;
}

table {
    color: #333;
    font-family: Tahoma, Verdana, Arial, Sans-Serif;
    font-size: 12px;
    line-height: 1.6;
}

.tborder {
    background: #fff;
    width: 100%;
    margin: 0 auto;
    border: 1px solid #C0C0C0;
    -moz-border-radius: 6px;
    -webkit-border-radius: 6px;
}

acronym, abbr {
    cursor: help;
    border-bottom: 1px dashed #555;
}

.thead {
    background: #182846 url(images/nesil/tablo.gif) repeat-x scroll left top;
    color: #fff;
    border-bottom: 1px solid #bebebe;
    padding: 7px 15px;
    -moz-border-radius-topleft: 6px;
    -moz-border-radius-topright: 6px;
    -webkit-border-top-left-radius: 6px;
    -webkit-border-top-right-radius: 6px;
    font-weight: bold;
}

.thead a:link, .thead a:visited {
    color: #fff;
    text-decoration: none;
}

.thead a:hover, .thead a:active {
    color: #fff;
    text-decoration: none;
}

.tcat {
    background: #eaeaea url(images/nesil/alt_tablo.png) top left repeat-x;
    color: #666;
    border-bottom: 1px solid #bebebe;
    font-size: 11px;
    padding: 5px 8px;
    text-shadow: 1px 1px 0 #fff;
}

.tcat a:link, .tcat a:visited, .tcat a:hover, .tcat a:active {
    color: #333;
}

.trow1 {
    background: #f5f5f5;
    border-bottom: 1px solid #e6e6e6;
    border-right: 1px solid #e6e6e6;
}

.trow2 {
    background: #efefef;
    border-bottom: 1px solid #e0e0e0;
    border-right: 1px solid #e6e6e6;
}

.trow_shaded {
    background: #ffdde0;
}

.trow_selected td {
    background: #FFFBD9;
    border-bottom: 1px solid #F7E86A;
}

.trow_sep {
    background: #f5f5f5 url(images/nesil/alt_tablo.png) top left repeat-x;
    color: #333;
    border-bottom: 1px solid #bebebe;
    font-size: 12px;
    font-weight: bold;
}

.tfoot {
    background: #182846 url(images/nesil/tablo.gif) repeat-x scroll left top;
    color: #fff;
    padding: 7px 15px;
    border-top: 1px solid #bebebe;
    -moz-border-radius-bottomleft: 6px;
    -moz-border-radius-bottomright: 6px;
    -webkit-border-bottom-left-radius: 6px;
    -webkit-border-bottom-right-radius: 6px;
}

.tfoot a:link, .tfoot a:visited {
    color: #fff;
    text-decoration: none;
}

.tfoot a:hover, .tfoot a:active {
    color: #fff;
    text-decoration: none;
}

.bottommenu {
    background: #f5f5f5 url(images/nesil/alt_tablo.png) top left repeat-x;
    color: #333;
    border-top: 1px solid #bebebe;
    padding: 6px;
}

.bottommenu div span.smalltext a {
    background-repeat: no-repeat;
    background-position: left;
    padding: 0 0 0 15px;
    margin-right: 15px;
    text-decoration: none;
}

.iletisim {background-image: url(images/nesil/ikon/iletisim.png);}
.anasayfa {background-image: url(images/nesil/ikon/anasayfa.png);}
.yukari {background-image: url(images/nesil/ikon/yukari.png);}
.arsiv {background-image: url(images/nesil/ikon/arsiv.png);}
.rss {background-image: url(images/nesil/ikon/rss.png);}

.navigation {
    color: #333;
    font-size: 11px;
    font-weight: bold;
}

.navigation a:link, .navigation a:visited {
    text-decoration: none;
}

.navigation a:hover, .navigation a:active {
    text-decoration: none;
}

.navigation .active {
    color: #333;
    font-size: 11px;
    font-weight: bold;
}

.smalltext {
    font-size: 11px;
}

.largetext {
    font-size: 16px;
    font-weight: bold;
}

textarea {
    background: #fff url(images/nesil/metinalani.gif) repeat-x scroll left top;
    border: 1px solid gray;
    padding: 0;
    line-height: 1.4;
    font-family: Tahoma;
    font-size: 12px;
}

select {
    background: #fff;
    border: 1px solid gray;
    font-family: Tahoma;
    font-size: 12px;
}

input.textbox {
    background: #fff url(images/nesil/metinalani.gif) repeat-x scroll left top;
    border: 1px solid gray;
    padding: 2px;
    font-family: Tahoma;
    font-size: 12px;
}

.editor {
    background: #f1f1f1;
    border: 1px solid #ccc;
}

.editor_control_bar {
    background: #fff;
    border: 1px solid #0f5c8e;
}

.autocomplete {
    background: #fff;
    border: 1px solid #000;
    color: black;
}

.autocomplete_selected {
    background: #adcee7;
    color: #333;
}

.popup_menu .popup_item_container {
    margin: 1px;
    text-align: right;
}

.popup_menu .popup_item {
    background: #fff;
    display: block;
    text-decoration: none;
    white-space: nowrap;
    border: 1px solid #ccc;
    outline: 1px solid #f5f5f5;
    padding: 3px 13px;
}

.popup_menu a.popup_item:hover {
    background: #1192d5;
    color: #fff;
    text-decoration: none;
}

.trow_reputation_positive {
    background: #ccffcc;
}

.trow_reputation_negative {
    background: #ffcccc;
}

.reputation_positive {
    color: green;
}

.reputation_neutral {
    color: #444;
}

.reputation_negative {
    color: red;
}

.invalid_field {
    border: 1px solid #f30;
    color: #f30;
}

.valid_field {
    border: 1px solid #0c0;
}

.validation_error {
    background: url(images/invalid.gif) no-repeat center left;
    color: #f30;
    margin: 5px 0;
    padding: 5px;
    font-weight: bold;
    font-size: 11px;
    padding-right: 22px;
}

.validation_success {
    background: url(images/valid.gif) no-repeat center left;
    color: #00b200;
    margin: 5px 0;
    padding: 5px;
    font-weight: bold;
    font-size: 11px;
    padding-right: 22px;
}

.validation_loading {
    background: url(images/spinner.gif) no-repeat center left;
    color: #555;
    margin: 5px 0;
    padding: 5px;
    font-weight: bold;
    font-size: 11px;
    padding-left: 22px;
}

/* Additional CSS (Master) */
img {
    border: none;
    vertical-align: middle;
        max-width:860px;
}

.clear {
    clear: both;
}

.hidden {
    display: none;
    float: none;
    width: 1%;
}

.hiddenrow {
    display: none;
}

.selectall {
    background-color: #FFFBD9;
    font-weight: bold;
    text-align: center;
}

.float_left {
    float: left;
}

.float_right {
    float: right;
}

.expcolimage {
    float: left;
    width: auto;
    vertical-align: middle;
    margin-top: 3px;
}

img.attachment {
    border: 1px solid #E9E5D7;
    padding: 2px;
}

hr {
    background-color: #000;
    color: #000;
    height: 1px;
    border: 0;
}

#copyright {
    background: #182846 url(images/nesil/tablo.gif) repeat-x scroll left top;
    color: #fff;
    margin: 0;
    padding: 6px;
    border-top: 1px solid #003366;
    height: 35px;
    text-align: left;
}

#copyright a {
    color: #fff;
    font-weight: bold;
}

#debug {
    float: right;
    text-align: right;
    margin-top: 0;
}

blockquote {
    background: #fafcfe;
    margin: 0;
    padding: 4px;
    border-left: 4px solid #8394B2;
    border-top: 1px dotted #333;
    border-right: 1px dotted #333;
    border-bottom: 1px dotted #333;
}

blockquote cite {
    background: #fafcfe url(images/nesil/alinti.gif) no-repeat right center;
    display: block;
    padding: 3px;
    font-style: normal;
    font-weight: bold;
}

blockquote cite span {
    float: left;
    font-weight: normal;
}

.codeblock {
    background: #fafcfe;
    margin: 0 auto;
}

.codeblock .title {
    background: #fddbcc url(images/nesil/kod.gif) no-repeat right;
    border-bottom: 1px solid #ccc;
    padding: 3px;
    margin: 0 auto;
    font-weight: bold;
}

.codeblock code {
    color: #465584;
    overflow: auto;
    height: auto;
    max-height: 200px;
    display: block;
    padding: 4px;
    border: 1px dotted #999;
    font-family: Monaco, Consolas, Courier, Monospace;
    font-size: 12px;
    direction: ltr;
    text-align: left;
}

.subforumicon {
    border: 0;
    vertical-align: middle;
}

.separator {
    margin: 5px;
    padding: 0;
    height: 0px;
    font-size: 1px;
    list-style-type: none;
}

form {
    margin: 0;
    padding: 0;
}

.popup_menu .popup_item_container {
    margin: 1px;
    text-align: left;
}

.popup_menu .popup_item {
    display: block;
    text-decoration: none;
    white-space: nowrap;
}

.popup_menu a.popup_item:hover {
    text-decoration: none;
}

.autocomplete {
    text-align: left;
}

.subject_new {
    font-weight: bold;
}

.highlight {
    background: #FFFFCC;
    padding-top: 3px;
    padding-bottom: 3px;
}

.pm_alert {
    background: #FFF6BF;
    border: 1px solid #FFD324;
    text-align: center;
    padding: 5px 20px;
    margin-bottom: 15px;
    font-size: 11px;
}

.red_alert {
    background: #FBE3E4;
    border: 1px solid #A5161A;
    color: #A5161A;
    text-align: center;
    padding: 5px 20px;
    margin-bottom: 15px;
    font-size: 11px;
}

.high_warning {
    color: #CC0000;
}

.moderate_warning {
    color: #F3611B;
}

.low_warning {
    color: #AE5700;
}

div.error {
    padding: 5px 10px;
    border-top: 2px solid #FFD324;
    border-bottom: 2px solid #FFD324;
    background: #FFF6BF;
    font-size: 12px;
}

div.error p {
    margin: 0;
    color: #000;
    font-weight: normal;
}

div.error p em {
    font-style: normal;
    font-weight: bold;
    padding-right: 24px;
    display: block;
    color: #C00;
    background: url(images/error.gif) no-repeat 0;
}

div.error.ul {
    margin-right: 24px;
}

.online {
    color: #15A018;
}

.offline {
    color: #C7C7C7;
}

.pagination {
    font-size: 11px;
    padding-top: 10px;
    margin-bottom: 10px;
}

.tfoot .pagination, .tcat .pagination {
    padding-top: 0;
}

.pagination .pages {
    font-weight: bold;
}

.pagination .pagination_current, .pagination a {
    background: #eaeaea url(images/nesil/alt_tablo.png) center left repeat-x;
    padding: 3px 8px;
    margin-bottom: 3px;
}

.pagination a {
    border: 1px solid #bbb;
    text-shadow: 1px 1px 0 #fff;
}

.pagination .pagination_current {
    background: #182846 url(images/nesil/tablo.gif) repeat-x left top;
    border: 1px solid #101b31;
    color: #fff;
    text-decoration: none;
    font-weight: bold;
}

.pagination a:hover, .pagination a:active {
    background: #182846 url(images/nesil/tablo.gif) repeat-x left top;
    border: 1px solid #101b31;
    color: #fff;
    text-decoration: none;
    text-shadow: 1px 1px 0 #444;
}

.thread_legend, .thread_legend dd {
    margin: 0;
    padding: 0;
}

.thread_legend dd {
    padding-bottom: 4px;
    margin-right: 15px;
}

.thread_legend img {
    margin-right: 4px;
    vertical-align: bottom;
}

.forum_legend, .forum_legend dt, .forum_legend dd {
    margin: 0;
    padding: 0;
}

.forum_legend dd {
    float: right;
    margin-right: 10px;
}

.forum_legend dt {
    margin-right: 10px;
    float: right;
}

.success_message {
    color: #00b200;
    font-weight: bold;
    font-size: 10px;
    margin-bottom: 10px;
}

.error_message {
    color: #C00;
    font-weight: bold;
    font-size: 10px;
    margin-bottom: 10px;
}

.post_body {
    padding: 5px;
    text-align: justify;
}

.post_content {
    padding: 5px 10px;
}

.quick_jump {
    background: url(images/jump.gif) no-repeat 0;
    width: 13px;
    height: 13px;
    padding-right: 13px;
    vertical-align: middle;
    border: none;
}

.repbox {
    font-size:16px;
    font-weight: bold;
    padding:5px 7px 5px 7px;
}

._neutral {
    background-color:#FAFAFA;
    color: #999999;
    border:1px solid #CCCCCC;
}

._minus {
    background-color: #FDD2D1;
    color: #CB0200;
    border:1px solid #980201;
}

._plus {
    background-color:#E8FCDC;
    color: #008800;
    border:1px solid #008800;
}

.pagination_breadcrumb {
    background-color: #f5f5f5;
    border: 1px solid #fff;
    outline: 1px solid #ccc;
    padding: 5px;
    margin-top: 5px;
    font-weight: normal;
}

.pagination_breadcrumb_link {
    vertical-align: middle;
    cursor: pointer;
}

.logo {
    height: 250px;
    position: relative;
    border-bottom: 1px solid #194a6c;
}

.logo a {
    background: url(images/nesil/logo.jpg) top left repeat-x;
    height: 250px;
    width: 950px;
    display: block;
    text-indent: -9999px;
}

.lower_panel a.login {
    background: url(images/nesil/ikon/giris.png) no-repeat right center;;
    padding: 1px 20px 1px 0px;
    margin-right: 15px;
    margin-left: 15px;
}

.lower_panel a.register {
    background: url(images/nesil/ikon/kayitol.png) no-repeat right center;;
    padding: 1px 20px 1px 0px;
    margin-right: 5px;
}

.lower_panel a.admincp {
    background: url(images/nesil/ikon/adminkp.png) no-repeat right center;
    padding: 1px 20px 1px 0px;
}

.lower_panel a.modcp {
    background: url(images/nesil/ikon/modkp.png) no-repeat right center;
    padding: 1px 20px 1px 0px;
}

.lower_panel a.usercp {
    background: url(images/nesil/ikon/kullanicikp.png) no-repeat right center;
    padding: 1px 20px 1px 0px;
}

.lower_panel {
    background: #eaeaea url(images/nesil/alt_tablo.png) top left repeat-x;
    color: #000;
    border-bottom: 1px solid #bebebe;
    padding: 6px;
    font-family: Tahoma, Verdana, Arial, Sans-Serif;
}

.lower_panel a {
    color: #626262;
    margin-right: 15px;
    text-shadow: 1px 1px 0 #fff;
}

.lower_panel a:hover, .lower_panel a:active {
    color: #333;
    text-decoration: none;
}

.upper_panel {
    background: #eaeaea url(images/nesil/alt_tablo.png) top left repeat-x;
    color: #333;
    border-bottom: 1px solid #bebebe;
    padding: 6px;
    font-family: Tahoma, Verdana, Arial, Sans-Serif;
}

.upper_panel a {
    padding-left: 20px;
    margin-right: 15px;
    text-shadow: 1px 1px 0 #fff;
    font-weight: bold;
}

.upper_panel a.logout {
    background: url(images/nesil/ikon/logout.gif) no-repeat right;
    padding-right: 20px;
    margin-left: 0;
    padding-left: 0;
    margin-right: 0;
}

#golge {
    background: url(images/nesil/golge.png) repeat-y;
    width: 986px;
    position: relative;
    margin: 0 auto;
    height: auto;
}

#golge_alt {
    background: url(images/nesil/golge_alt.png) no-repeat;
    height: 18px;
    width: 986px;
    margin: 0 auto;
}

.alt_forumlar {
    list-style: none;
    margin: 0;
    padding: 0;
}

.alt_forumlar li {
    width: 33%;
    float: left;
    line-height: 20px;
}

#menu {
    background: url(images/nesil/menu_bg_baslar.png) no-repeat;
    position: absolute;
    top: 217px;
    right: 18px;
    padding-left: 41px;
    font-family: Tahoma, 'Trebuchet MS', Arial, sans-serif;
}

#menu ul {
    background: #016db0 url(images/nesil/menu_bg.png) repeat-x;
    list-style: none;
    margin: 0;
    padding: 0;
    height: 34px;
}

#menu li {
    float: right;
    margin-top: 4px;
    margin-right: 10px;
}

#menu li a {
    color: #fff;
    padding: 4px 10px 1px;
    text-decoration: none;
    display: block;
    border-bottom: 0;
}

#menu li a:hover {
    color: #fff;
    border-bottom: 2px solid #fff;
    text-decoration: none;
}

#menu li.active a, #menu li.active a:hover {
    background: url(images/nesil/menu_bg_aktif.png) no-repeat top left;
    color: #333;
    padding: 4px 10px 4px 13px;
    border-bottom: 2px solid #fff;
}

#menu li.active {
    background: url(images/nesil/menu_bg_aktif2.png) no-repeat top right;
    padding-right: 4px;
    position: relative;
    bottom: -2px;
}

.yazar a:link, .yazar a:visited, .yazar a:hover, .yazar a:active {
    color: #333;
    text-decoration: none;
}

form#lang_select {
    margin-top: -4px;
}

.author {
    background: url(images/nesil/nav_bit.gif) no-repeat center right;
    padding-right: 20px;
}

.remember_me input {
    vertical-align: sub;
}

.messageEditor .toolbar_button {
    cursor: pointer;
}

.post_avatar img {
    background: #fff;
    border: 1px solid #ddd;
    padding: 1px;
}

.button {
    cursor: pointer;
        font-family: Tahoma;
        font-size: 11px;
}
        
.transcend_kardr_1 legend {
border:1px solid #314563;
color:#12340d;
font-weight:bold;
background-color:#f0f0f0;
margin:10px 10px 0 0;
padding:2px;
}
.transcend_kardr_1 fieldset {
margin-top:10px;
border:1px dashed #314563;
width:900px;
margin:0 auto;
padding:7px 5px;
}
لطفا آدرس انجمن تو امضا بذارید و موقع ارسال تیک امضا رو بزنید.

برای اینکار من بهتون استفاده از درصد رو پیشنهاد میکنم بجای پیکسل.ساده تر هم هست.
درود.استفاده از درصد ایده خوبیه اما خوبی رسپونسیو کردن اینه که می شه برای هر کودوم از نمایشگر ها یه بنر با سایز متفاوت ساخت و تو هر سایزی بنر متناسب رو نمایش داد.شما ایده ای دارید برای تغییر سایز بنر متناسب با سایز نمایشگر ؟
منظور رسپونسیو همون تفاوت مثل گوشی با کامپیوتر و تبلت هست.!
خب برای این به نظرم کاری پس عجیب و طولانی مدت باید انجام داد.
چون شما باید مثل نسخه موبایلی بشینید طراحی کنید و دستور ایجاد کنید که اگر عرضش اینجور بود اینطور نشون بده.
کار سختیه اما خب مثل بقیه قالب ها شدنیه.
چطور اینکارو میکنن رو بلد نیستم متاسفانه وگرنه حتما کمک میکردم.
درود.کار راحتیه،کلا 2 ساعت عم تول نمیکشه.فقط کافیه برای چند تا بلوک اصلی قالب css های متفاوت بنویسید.یه سرچ تو نت بزنید 2 ساعته یاد میگیرید
کد:
margin: 0 auto;
مقدار 0 یعنی فاصله بالا و پایین تعیین نشده
auto هم که بعد از اون اومده یعنی فاصله سمت چپ و راست -باتوجه به عرض مرورگر- automatic تعیین بشه
درود.ممنون از پاسختون.اون مشکل حل شد حالا یه مشکل جدید.بعضی صفحات رو که باز می کنی انجمن متمایل به راست نمایش داده می شه.یعنی بلوک اصلی انجمن چسبیده به سمت راست و وستچین نیست.البته فقط صفحاتی که درش نماد # قرار داره مثل:

http://iranpigeons.ir/Forum/showthread.p...18#pid4618

که فکر میکنم اسکرول رو به پست خاصی هدایت میکنه اما صفحات دیگه مثل:

http://iranpigeons.ir/Forum/showthread.php?pid=4618

مشکلی ندارن.لازمه که بگم من انجمن رو رسپونسیو کردم.یعنی برای مانیتورهای با حداکثر 1023 پیکس عرض یه css لحاظ میشه و تا 1920 پیکسل عرض یه تنظیم دیگه در css.گفتم شاید تو به وجود اومدن مشکل دخیل باشه
درود

در سایت شما پلاگین SubforInCols.php مشکل ایجاد کرده.
درود.اون مشکل حل شد.اگه ممکنه به سولم پاسخ بدین
دوستان علت وجود دو تا فایل بود که به منظور شناختن html5 و به اینترنت اکسپلورر ضمیمه شدن.با قرار دادن اونها بین دستورات شرطی مرورگر اینترنت اکسپلورر مشکل حل شد

کد:
<!--[if IE]>
<script type="text/javascript" src="jscripts/html5.js"></script>
<script type="text/javascript" src="jscripts/css3-mediaqueries.js"></script>
<![endif]-->