Forum PHP.pl > Zmiana szerokości paneli

Pomoc - Szukaj - Użytkownicy - Kalendarz

Pełna wersja: Zmiana szerokości paneli

Forum PHP.pl > Forum > PHP

pawelek1261

13.07.2012, 16:05:06

Witam! jak mogę zmienić szerokość środkowych paneli?

IceManSpy

13.07.2012, 16:10:58

Szklana kula, która rozlała kawę z fusami mówi, że trzeba wykorzystać parametr width

batman

13.07.2012, 16:13:30

Cytat(pawelek1261 @ 13.07.2012, 17:05:06 )

Witam! jak mogę zmienić szerokość środkowych paneli?

O tak - http://www.youtube.com/watch?v=KkfPEHOUwzQ

pawelek1261

13.07.2012, 16:16:13

Może ja pokaże swój .css bo ja w nim od środkowych paneli nie widze za bardzo żadnych kierunków dotyczących width

Kod

/* Comment element properties */

a {
    color: #FFF;
    text-decoration: none;
}

a:hover {
    color: #FFF;
    text-decoration: underline;
}

a.side {
    color: #CBCBCB;
    text-decoration: none;
}

a:hover.side {
    color: #FFF;
    text-decoration: underline;
}

a.white, li.white a {
    color: #FFF;
    text-decoration: none;
    padding: 6px 15px 6px 15px;
    border-width: 0 1px 0px 0px;
    border-color: #292a2c;
    border-style: solid;
}

a:hover.white, li.white a:hover {
    color: #1c1c1c;
    text-decoration: none;
    padding: 6px 15px 6px 15px;
    border-width: 0 1px 0px 0px;
    border-color: #292a2c;
    border-style: solid;
}

body {
    font-family: Verdana, Arial, Helvetica, sans-serif;
    font-size: 11px;
    color: #CBCBCB;
    background: #000;
    margin: 0px;
}

hr {
    height: 1px;
    border: 1px solid #272727;
}

hr.side-hr {
    height: 1px;
    border: 1px solid #272727;
}

td {
    font-family: Verdana, Arial, Helvetica, sans-serif;
    font-size: 11px;
}

pre {
    font-family: Verdana, Arial, Helvetica, sans-serif;
    font-size: 11px;
}

.alt {
    color: #CBCBCB;
}

.spacer {
    margin-bottom: 10px;
}
.admin-message {
    font-family: Verdana, Arial, Helvetica, sans-serif;
    font-size: 11px;
    text-align: center;
    color: #CBCBCB;
    background-color: #323232;
    border: 1px solid #000;
    padding: 3px 4px 5px 4px;
    margin-bottom: 5px;
}

a.menuu span {

display:none;

padding:2px 3px;

margin-left:5px;

width:180px;

}

a.menuu:hover span{

display: block;

z-index: 3;

position: absolute;

margin: -2px 0 0 -15px;

border:0px solid #ffffff;

color:#000000;

}

#fff; padding:3px; border:1px solid #3a93d2; white-space:nowrap; width:90px; z-index:400; height:auto;}

/* Form element properties */

form {
    margin: 0px;
}

.button {
    font-family: Verdana, Arial, Helvetica, sans-serif;
    font-size: 10px;
    font-weight: bold;
    color: #fff;
    background-color: #404040;
    background-image: url(images/button.gif);
    height: 20px;
    border: 1px solid #000;
    margin-top: 2px;
}

.bbcode {
    font-family: Verdana, Arial, Helvetica, sans-serif;
    font-size: 10px;
    color: #000;
    background-color: #eee;
    border: 1px solid #000;
    margin-top: 2px;
}

.textbox {
    font-family: Verdana, Arial, Helvetica, sans-serif;
    font-size: 10px;
    color: #CBCBCB;
    background-color: #323232;
    border: 1px solid #000;
}

/* Header and footer properties */

.sub-header ul{
    margin: 0;
    padding: 0;
}

.sub-header ul li{
    display: inline;
}

.sub-header ul li.first-link .bullet{
    display: none;
}

.full-header {
    font-family: Verdana, Arial, Helvetica, sans-serif;
    font-size: 10px;
    color: #399afc;
    padding: 0px 0px 0px 0px;
}

.glowna {
        padding: 0px 100px 0px 0px;}

.main-footer {
    font-family: Verdana, Arial, Helvetica, sans-serif;
    font-size: 9px;
    color: #888;
    padding: 5px;
}

.bottom-footer {
    font-family: Verdana, Arial, Helvetica, sans-serif;
    font-size: 10px;
    color: #CBCBCB;
    background-color: #323232;
    padding: 4px 4px 5px 4px;
}

.main-body {
    font-size: 10px;
    color: #CBCBCB;
    background-color: #1c1c1c;
    border-width: 0 1px 0 1px;
    border-color: #272727;
    border-style: solid;
    padding: 10px 10px 0 10px;
}

/* Side-Panel properties */

.side-border-left {
    color: #777;
    padding: 0px 0 5px 5px;
    width: 175px;
}

.side-border-right {
    color: #777;
    padding: 0px 5px 5px 0;
    width: 175px;
}

.scapmain {
    font-family: Verdana, Arial, Helvetica, sans-serif;
    font-size: 10px;
    font-weight: bold;
    color: #FFF;
    background-color: #323232;
    background-image: url(images/side.png);
  background-repeat: repeat-x;
}

.scapmain-left {
    width: 10px;
    height: 27px;
    background-color: #323232;
    background-image: url(images/side-left.png);
}

.scapmain-right {
    width: 10px;
    height: 27px;
    background-color: #323232;
    background-image: url(images/side-right.png);
}

.side-body {
    font-size: 10px;
    color: #fff;
    background-color: #1c1c1c;
    border-width: 0 0 0 1px;
    border-color: #272727;
    border-style: solid;
    padding: 10px 10px 0 10px;
}

.sideb {     background-image: url(images/sideb.png);     background-repeat: repeat-x; }

/* Center-Panel properties */

.news-category {
    border: 0;
    margin: 3px 5px 0 0;
    float: left;
}

.news-footer {
    font-size: 10px;
    color: #CBCBCB;
    background-color: #1c1c1c;
    border-width: 0 1px 0 1px;
    border-color: #272727;
    border-style: solid;
    padding: 3px 4px 0 4px;
}

.capmain {
    font-family: sans-serif, Helvetica, Verdana, Arial;
    font-size: 11px;
      font-weight: bold;
    color: #399afc;
    background-color: #1c1c1c;
    background-image: url(images/cc.png);
    border-width: 0px 0px 0 0px;
    border-color: #272727;
    border-style: solid;
    padding: 0px 4px 4px 4px;
}

.capmain-left {
    width: 10px;
    height: 27px;
    background-color: #323232;
    background-image: url(images/cleft.png);
}

.capmain-right {
    width: 10px;
    height: 27px;
    background-color: #323232;
    background-image: url(images/cright.png);
}

.main-bg {
    color: #CBCBCB;
    padding: 0px 5px 0 5px;
}

/* General table properties */

.center {
    margin: 0 auto;
}

.tbl-border {
    background-color: #000;
}

.tbl {
    font-size: 11px;
    color: #CBCBCB;
    padding: 4px;
}

.tbl1 {
    font-size: 11px;
    color: #fff;
    background-color: #2c2c2c;
    padding: 4px;
}

.tbl2 {
    font-size: 11px;
    color: #fff;
    background-color: #1c1c1c;
    padding: 4px;

}

.forum-caption {
    font-size: 11px;
    font-weight: bold;
    color: #fff;
    background-color: #2c2c2c;
    padding: 2px 4px 4px 4px;
}

.quote {
    font-size: 11px;
    color: #CBCBCB;
    background-color: #323232;
    padding: 4px;
    margin: 0px 20px 0px 20px;
    border: 1px solid #000;
}

.poll {
    height: 12px;
    border: 1px solid #000;
}

.comment-name {
    font-weight: bold;
    color: #CBCBCB;
}

.shoutboxname {
    font-weight: bold;
    color: #888;
}

.shoutbox {
    color: #CBCBCB;
}

.shoutboxdate {
    font-size: 8px;
    color: #888;
}

.small {
    font-size: 10px;
    font-weight: normal;
}

.small2 {
    font-size: 10px;
    font-weight: normal;
    color: #CBCBCB;
}

.side-small {
    font-size: 10px;
    font-weight: normal;
    color: #CBCBCB;
}

.side-label {
    color: #CBCBCB;
    margin: 2px 0 2px 0;
    padding: 2px 2px 3px 2px;
}

/* Vertical Navigation */

#navigation h2 {
    font-size: 10px;
    font-weight: normal;
    background-color: #323232;
    margin: 0;
    padding: 4px;
}

#navigation ul {
    margin: 0;
    padding: 0;
    list-style-type: none;
}

* html #navigation ul li{
   height: 1%;
}

#navigation a {
    display: block;
    color: #CBCBCB;
    padding: 2px;
    text-decoration: none;
}

#navigation a:hover {
    color: #CBCBCB;
    background-color: #323232;
}

/* Page Navigation */

.pagenav {
    padding: 4px;
}

.pagenav span {
    color: #CBCBCB;
    background-color: #323232;
    border: 1px solid #000;
    padding: 2px 4px 2px 4px;
    margin: 2px;
}

.pagenav a {
    color: #CBCBCB;
    background-color: #323232;
    border: 1px solid #000;
    padding: 2px 4px 2px 4px;
    margin: 2px;
    text-decoration: none;
}

.pagenav a:hover {
    color: #CBCBCB;
    background-color: #323232;
    margin: 2px;
    text-decoration: none;
}

PS @Batman fajne zachowanie z twojej strony jako moderator:)

sobol6803

13.07.2012, 16:18:22

Linka daj...

Cytat(pawelek1261 @ 13.07.2012, 17:16:13 )

PS @Batman fajne zachowanie z twojej strony jako moderator:)

Adekwatne do Twojego wyczerpującego opisania problemu.

pawelek1261

13.07.2012, 16:19:24

Nie mogę za bardzo bo dopiero tworze strone;/

sobol6803

13.07.2012, 16:21:37

Cytat(pawelek1261 @ 13.07.2012, 17:19:24 )

Nie mogę za bardzo bo dopiero tworze strone;/

To skąd mamy wiedzieć gdzie i jak wyglądają te Twoje środkowe panele? Kontraktu z wróżbitą Maciejem nie podpisaliśmy. Chociaż daj kod HTML tych "środkowych paneli".

pawelek1261

13.07.2012, 16:22:54

No dlatego pokazuję wam CSS. Chodzi mi tylko aby zmienić ich szerokość na mniejszą

batman

13.07.2012, 16:33:14

Cytat(pawelek1261 @ 13.07.2012, 17:16:13 )

PS @Batman fajne zachowanie z twojej strony jako moderator:)

Mimo iż forum jest nastawione głównie na PHP oraz tematy z tym językiem powiązane, zdarzają się czasami przypadki, iż młody adept sztuki programowania, poszukuje pomocy w dziedzinie nieco odbiegającej od głównej tematyki forum. Przyjąłem, niesłusznie jak się okazało, że chodzi o panele podłogowe. Nie wiem, co mną powodowało, gdy pisałem odpowiedź na wyczerpująco zadane pytanie.

A na poważnie. Jeśli chcesz uzyskać odpowiedź na swoje pytanie, to:
a) Jak poprawnie zadać pytanie

zamieść gdzieś przykład (np. na http://jsfiddle.net) demo.

sobol6803

13.07.2012, 16:33:35

Cytat(pawelek1261 @ 13.07.2012, 17:22:54 )

No dlatego pokazuję wam CSS. Chodzi mi tylko aby zmienić ich szerokość na mniejszą

Dzięki komentarzom w css możemy ukrócić to do:

[CSS] pobierz, plaintext 
/* Center-Panel properties */
 
.news-category {
    border: 0;
    margin: 3px 5px 0 0;
    float: left;
}
 
.news-footer {
    font-size: 10px;
    color: #CBCBCB;
    background-color: #1c1c1c;
    border-width: 0 1px 0 1px;
    border-color: #272727;
    border-style: solid;
    padding: 3px 4px 0 4px;
}
 
.capmain {
    font-family: sans-serif, Helvetica, Verdana, Arial;
    font-size: 11px;    
      font-weight: bold;
    color: #399afc;
    background-color: #1c1c1c;
    background-image: url(images/cc.png);
    border-width: 0px 0px 0 0px;
    border-color: #272727;
    border-style: solid;
    padding: 0px 4px 4px 4px;
}
 
.capmain-left {
    width: 10px;
    height: 27px;
    background-color: #323232;
    background-image: url(images/cleft.png);
}
 
.capmain-right {
    width: 10px;
    height: 27px;
    background-color: #323232;
    background-image: url(images/cright.png);
}
 
.main-bg {
    color: #CBCBCB;
    padding: 0px 5px 0 5px;
}
[CSS] pobierz, plaintext

Jednak to dalej nic nie wyjaśnia! Pokaż te div'y z pliku html (lub php), które odpowiadają za "środkowe panele". Po omacku się nie da.

Ew. próbuj do każdego selektora powyżej dodać

[CSS] pobierz, plaintext 
   width: 200px;
[CSS] pobierz, plaintext

lub inną wartość w pikselach. Może trafisz na właściwy selektor.

Kshyhoo

13.07.2012, 17:36:32

Cytat(pawelek1261 @ 13.07.2012, 17:19:24 )

Nie mogę za bardzo bo dopiero tworze strone;/

Nie tworzysz, tylko psujesz to, co już ktoś napisał. Dlaczego tak sądzę? Po komentarzach w kodzie, który załączyłeś.
Panowie, Panie, moim zdaniem grzebać trzeba tu:

[CSS] pobierz, plaintext 
/* Side-Panel properties */
 
.side-border-left {
    color: #777;
    padding: 0px 0 5px 5px;
    width: 175px;
}
 
.side-border-right {
    color: #777;
    padding: 0px 5px 5px 0;
    width: 175px;
}
[CSS] pobierz, plaintext

pawelek1261

13.07.2012, 20:29:59

Kshyho side-border-right i side-border-left są od paneli bocznych, bo już to zmieniałem.
Dam też poniżej theme.php może ktoś to da rade rozszyfrować

Kod

<?php
if (!defined("IN_FUSION")) { die("Access Denied"); }

define("THEME_BULLET", "<span class='bullet'><img src='".THEME."/images/bullet.gif'></span>");

require_once INCLUDES."theme_functions_include.php";

function render_page($license=false) {

    global $settings, $main_style, $locale;

echo"

<table align='center' cellspacing='0' cellpadding='0' id='main'>

    <tr>

    <td>



    <table cellpadding='0' cellspacing='0' width='100%'>

    <tr>

    <td class='full-header'>



    <table cellpadding='0' cellspacing='0' width='100%'>

    <tr>

    <td>".showbanners()."</td>

    </tr>

    </table>



    </td>

    </tr>

    </table>";
//Content
    echo "<table cellpadding='0' cellspacing='10' width='100%' class='$main_style'>\n<tr>\n";
    if (LEFT) { echo "<td class='side-border-left' valign='top'>".LEFT."</td>"; }
    echo "<td class='main-bg' valign='top'>".U_CENTER.CONTENT.L_CENTER."</td>";
    if (RIGHT) { echo "<td class='side-border-right' valign='top'>".RIGHT."</td>"; }
    echo "</tr>\n</table>\n";


    //Footer
    echo "</tr>\n</table>\n";
    echo "<table cellpadding='0' cellspacing='0' width='100%'>\n<tr>\n";
    echo "<td align='left' class='main-footer'>Desing created by <a href='mailto:lrd_olteanu@yahoo.com'>Look</a> | Coded by <a href='mailto:ewe_3w3@ayhoo.com'>eWe</a><br />Theme by <a href='http://gfxpixel.info'>GFXpixel.info</a><br />Design Downloaded from <a href='http://www.template4all.com/php-fusion/' title='free phpfusion themes' target='_blank'>free phpfusion themes</a> | <a href='http://www.freethemes4all.com/' title='free website templates' target='_blank'>free website templates</a> | <a href='http://www.seodesign.us/' title='free psd files download' target='_blank'>free psd files</a><br />".showcounter()."";

    if (!$license) { echo "\n".showcopyright(); }
    echo "</br> ".stripslashes($settings['footer']);
    echo "</td>\n";
    echo "</tr>\n</table>\n";


}

function render_news($subject, $news, $info) {

    echo "<table cellpadding='0' cellspacing='0' width='100%'>\n<tr>\n";
    echo "<td class='capmain-left'></td>\n";
    echo "<td class='capmain'>".$subject."</td>\n";
    echo "<td class='capmain-right'></td>\n";
    echo "</tr>\n</table>\n";
    echo "<table width='100%' cellpadding='0' cellspacing='0'>\n<tr>\n";
    echo "<td class='main-body middle-border'>".$news."</td>\n";
    echo "</tr>\n<tr>\n";
    echo "<td align='center' class='news-footer middle-border'>\n";
    echo newsposter($info," ?").newsopts($info,"?").itemoptions("N",$info['news_id']);
    echo "</td>\n";
    echo "</tr>\n</table>\n";
    echo "<table cellspacing='0' cellpadding='0'><tr><td align='left'><img src='".THEME."/images/sideb-left.png' class='spacer'></td>
    <td align='center' class='sideb' width='100%'></td>
    <td align='right'><img src='".THEME."/images/sideb-right.png' class='spacer'></td>
    </tr></table>\n";
}

function render_article($subject, $article, $info) {

    echo "<table width='100%' cellpadding='0' cellspacing='0'>\n<tr>\n";
    echo "<td class='capmain-left'></td>\n";
    echo "<td class='capmain'>".$subject."</td>\n";
    echo "<td class='capmain-right'></td>\n";
    echo "</tr>\n</table>\n";
    echo "<table width='100%' cellpadding='0' cellspacing='0'>\n<tr>\n";
    echo "<td class='main-body middle-border'>".($info['article_breaks'] == "y" ? nl2br($article) : $article)."</td>\n";
    echo "</tr>\n<tr>\n";
    echo "<td align='center' class='news-footer'>\n";
    echo articleposter($info," ?").articleopts($info,"?").itemoptions("A",$info['article_id']);
    echo "</td>\n</tr>\n</table>\n";
    echo "<table cellspacing='0' cellpadding='0'><tr><td align='left'><img src='".THEME."/images/sideb-left.png' class='spacer'></td>
    <td align='center' class='sideb' width='100%'></td>
    <td align='right'><img src='".THEME."/images/sideb-right.png' class='spacer'></td>
    </tr></table>\n";

}

function opentable($title) {

    echo "<table cellpadding='0' cellspacing='0' width='100%'>\n<tr>\n";
    echo "<td class='capmain-left'></td>\n";
    echo "<td class='capmain'>".$title."</td>\n";
    echo "<td class='capmain-right'></td>\n";
    echo "</tr>\n</table>\n";
    echo "<table cellpadding='0' cellspacing='0' width='100%'>\n<tr>\n";
    echo "<td class='main-body'>\n";

}

function closetable() {

    echo "</td>\n";
    echo "</tr>\n</table>\n";
    echo "<table cellspacing='0' cellpadding='0'><tr><td align='left'><img src='".THEME."/images/sideb-left.png' class='spacer'></td>
    <td align='center' class='sideb' width='100%'></td>
    <td align='right'><img src='".THEME."/images/sideb-right.png' class='spacer'></td>
    </tr></table>\n";

}

function openside($title, $collapse = false, $state = "on") {

    global $panel_collapse; $panel_collapse = $collapse;

    echo "<table cellpadding='0' cellspacing='0' width='100%'>\n<tr>\n";
    echo "<td class='scapmain-left'></td>\n";
    echo "<td align='center' class='scapmain'>$title</td>\n";
    if ($collapse == true) {
        $boxname = str_replace(" ", "", $title);
        echo "<td class='scapmain' align='right'>".panelbutton($state, $boxname)."</td>\n";
    }
    echo "<td class='scapmain-right'></td>\n";
    echo "</tr>\n</table>\n";
    echo "<table cellpadding='0' cellspacing='0' width='100%'>\n<tr>\n";
    echo "<td class='side-body'>\n";
    if ($collapse == true) { echo panelstate($state, $boxname); }

}

function closeside() {

    global $panel_collapse;

    if ($panel_collapse == true) { echo "</div>\n"; }
    echo "</td>\n</tr>\n</table>\n";
    echo "<table cellspacing='0' cellpadding='0'><tr><td align='left'><img src='".THEME."/images/sideb-left.png' class='spacer'></td>
    <td align='center' class='sideb' width='100%'></td>
    <td align='right'><img src='".THEME."/images/sideb-right.png' class='spacer'></td>
    </tr></table>\n";

}
?>

sobol6803

13.07.2012, 22:43:14

Z tego wynika, że jednak musisz zmniejszyć panele boczne. Mogę się mylić, ale spróbuj dać parametr width na 150px, 120px, itp.

[CSS] pobierz, plaintext 
    /* Side-Panel properties */
 
    .side-border-left {
    color: #777;
    padding: 0px 0 5px 5px;
    width: 175px;
    }
 
    .side-border-right {
    color: #777;
    padding: 0px 5px 5px 0;
    width: 175px;
    }
[CSS] pobierz, plaintext

To jest php-fusion, tak?

thek

13.07.2012, 23:15:51

Patrząc na funkcje wklejone..Tak, to php-fusion, bo miałem kiedyś z nim do czynienia i openside, closetable tyczyły sidebarów.

pawelek1261

14.07.2012, 05:36:10

Tak php fusion. Kurde bo właśnie panele boczne (prawy) chcę mieć większy a środkowy troche pomniejszyć

Kshyhoo

14.07.2012, 08:07:31

Zmniejsz parametry tego, o czym wcześniej pisałem. Jak widzisz, są trzy komórki tabeli: side-border-left + main-bg + side-border-right odpowiedzialne za szerokość thema. Swoją drogą, poszukaj lepiej thema z divami...

[PHP] pobierz, plaintext 
echo "<table cellpadding='0' cellspacing='10' width='100%' class='$main_style'>\n<tr>\n";
    if (LEFT) { echo "<td class='side-border-left' valign='top'>".LEFT."</td>"; }
    echo "<td class='main-bg' valign='top'>".U_CENTER.CONTENT.L_CENTER."</td>";
    if (RIGHT) { echo "<td class='side-border-right' valign='top'>".RIGHT."</td>"; }
    echo "</tr>\n</table>\n";
[PHP] pobierz, plaintext

sobol6803

14.07.2012, 10:32:45

Cytat(pawelek1261 @ 14.07.2012, 06:36:10 )

Tak php fusion. Kurde bo właśnie panele boczne (prawy) chcę mieć większy a środkowy troche pomniejszyć

Z tego co widać, to ustalasz tylko rozmiary bocznych paneli, a środkowy ustawia się sam, więc zwiększ width prawego, to wtedy środkowy powinien się pomniejszyć.

pawelek1261

14.07.2012, 22:02:21

No właśnie jak powiększe np. do 500px prawy to on się maksymalnie powiększy do 300pxdlatego właśnie, że blokuje go środkowy;/

IceManSpy

14.07.2012, 22:11:10

Zainstaluj sobie w Firefox lub Chrome dodatek Firebug i zobacz jakie parametry ma środkowy panel. Tak będzie Ci łatwiej to znaleźć i edytować.

pawelek1261

14.07.2012, 22:24:17

Ok jakoś sobie z tym już poradziłem. A mam jeszcze jedno pytanie trochę mniej dotycząca paneli. Bo na stronie mam menu i zaraz pod nim system newsów to jako mogę odzielić menu od systemu newsów aby między nimi była większa odległość?

To jest wersja lo-fi głównej zawartości. Aby zobaczyć pełną wersję z większą zawartością, obrazkami i formatowaniem proszę kliknij tutaj.