ทำไมใส่ภาพโลโก้ใหม่แล้ว จึงไม่ย่อ หรือขยายตาม webpage

column หดได้เป็นเพราะว่ามีการตั้งค่า width เป็นแบบ % หรือ em
ถ้าเราไม่ต้องการให้หด เราต้องกำหนดค่า width เป็น px หรือ in (หน่วยนิ้ว)

แต่ถ้าเราต้องการให้ logo หดได้เช่นเดียวกับ column ก็ทำลักษณะเดียวกันครับ  คือการตั้งค่า width ให้เป็น % หรือ em ครับ

เช่น

<img src="xxxx" alt="xxx" width="xx%" />

ทั้งนี้ความกว้างจะอิงกับ parent element ครับ

เอ่อ ก็ต้องแก้ที่ theme.php ครับ ตรงตำแหน่งที่แสดง logo
เพราะว่า syntax ดังกล่าวคือ syntax ของ img ไงครับ

แต่ไม่แน่ใจว่าถ้าเราเอาโค้ดนี้ไปใส่เป็น banner ใน php-fusion น่าจะได้เลยหรือเปล่า

ส่วน punbb ต้องโหลดตัว Attachment extensions มาติดตั้งเพิ่มครับ เพราะว่าการทำงานของ punbb ค่อนข้างเบา ทำให้ไม่มี option นี้ติดมาด้วยครับ

1.ใช่ครับ โหลดกลับมาก่อน เพราะว่าน่าจะต้องแก้ที่ตัว theme มันเลย
2.http://punbb.informer.com/wiki/punbb13/extensions/pun_attachment
3.ภาษาไทย punbb ไม่มีครับ ที่เห็นและใช้งานอยู่นั้น ผมเป็นคนแปลเองครับ

หมายถึงตัว theme หรือ extension ครับ ถ้า extension ก็ตามนี้ครับ http://punbb.informer.com/forums/topic/ … xtensions/

ส่วนนี่เป็นรายระเอียดของ themp ปัจจุบันที่ใช้ แล้ว ต้อง ไปแก้ค่า ตรงไหนครับ logo รูปภาพ ของเรา ถึงจะ ยืดได้หดได้  เพราะ บางที่ถ้าดู ความละเอียดหน้าจอที่  1024*768      logo ดูได้เต็มจอ พอดี   แต่ ถ้า ดู ด้วย ความละเอียดสูงกว่านี้ หรือ เป็น จอ widescreen   logo  จะหดเหลือครึ่งเวป พอดีเลยครับ

<?php
/*.phos Theme for PHP-Fusion v7......*|
|*.Author: Max "Matonor" Toball......*|
|*.Released under the Affero GPLv3...*/

//Theme Settings
define("THEME_WIDTH", "95%"); //theme width. Make sure to adapt the margin-left in the first div (-width/2).
define("THEME_BULLET", "<span class='bullet'>&middot;</span>"); //bullet image
$enable_colour_switcher = true; //true=enable colour switcher | false=disable colour switcher
$enable_fontsize_switcher = true; //true=enable fontsize switcher | false=disable fontsize switcher
$enable_column_switcher = true; //true=enable column switcher | false=disable column switcher
//Theme Settings /

if (!defined("IN_FUSION")) { header("Location: ../../index.php"); exit; }
require_once INCLUDES."theme_functions_include.php";
require_once THEMES."templates/switcher.php";

$colour_switcher = new Switcher("select", "colour", "gif", "blue", "switcherbutton");
if(!$enable_colour_switcher){
    $colour_switcher->disable();
}

$column_switcher = new Switcher("select", "columns", "gif", "both", "switcherbutton");
if(!$enable_column_switcher){
    $column_switcher->disable();
}

$fontsize_switcher = new Switcher("increment", "fontsize", "gif", 1, "switcherbutton", "", true, array("step" => 0.1, "max" => 1.5));
if(!$enable_fontsize_switcher){
    $fontsize_switcher->disable();
}

redirect_img_dir(THEME."forum", THEME."forum/".$colour_switcher->selected);
set_image("pollbar", THEME."images/panelcap_bg.jpg");

function get_head_tags(){
    global $colour_switcher, $fontsize_switcher, $column_switcher;
    echo $colour_switcher->makeHeadTag();
    echo $column_switcher->makeHeadTag();
    echo "<style type='text/css'>body{font-size: ".$fontsize_switcher->selected."em;}</style>";
    echo "<!--[if lte IE 7]><style type='text/css'>.clearfix {display:inline-block;} * html .clearfix{height: 1px;}#subheader ul {display:inline-block;}#subheader ul {display:inline;}#subheader ul li {float:left;} #main-bg, .panelbody{position: relative;}</style><![endif]-->";
}

function render_page($license=false) {

global $aidlink, $locale, $settings, $colour_switcher, $fontsize_switcher, $column_switcher, $main_style;

    echo "<div id='main' style='width: ".THEME_WIDTH."; left: 50%; margin-left: -47.5%;'>
        <div id='header_t'><div id='header_r'><div id='header_l'><div id='corner_tr'><div id='corner_tl'>
            <div id='header'>
            <div id='header_bg' class='clearfix'>
                <div id='userbar' class='floatfix'>
                    <ul id='anchors' class='flleft'><li><a href='#content'>".$locale['global_210']."</a></li></ul>
                    <ul id='links' class='clearfix flright'>\n";
                    if(iMEMBER){
                        echo "\t\t\t\t\t\t\t<li><a href='".BASEDIR."edit_profile.php'>".$locale['global_120']."</a> </li>
                        <li> | <a href='".BASEDIR."messages.php'>".$locale['global_121']."</a></li>
                        ".(iADMIN ? "<li> | <a href='".ADMIN."index.php".$aidlink."' >".$locale['global_123']."</a></li>" : "")."
                        <li> | <a href='".BASEDIR."setuser.php?logout=yes'>".$locale['global_124']."</a></li>\n";
                    }else{
                        echo "\t\t\t\t\t\t\t<li><a href='".BASEDIR."login.php'>".$locale['global_104']."</a></li>
                        ".($settings['enable_registration'] ? "<li> | <a href='".BASEDIR."register.php'>".$locale['global_107']."</a></li>\n" : "");
                    }
                    echo "\t\t\t\t\t\t</ul>
                </div>
                <div id='mainheader' class='clearfix'>".showbanners()."</div>
                <div id='subheader' class='flleft'>".
                preg_replace("^(li)( class='(first-link)')*(><a href='(\.\./)*".preg_quote(START_PAGE)."')^i", "\\1 class='active \\3'\\4", showsublinks(""))."</div>
                <div id='tab' class='flright'>
                    <div id='tab_r' class='clearfix'>
                        ".$colour_switcher->makeForm("flright")."
                        ".$column_switcher->makeForm("flright")."
                        ".$fontsize_switcher->makeForm("flright")."
                    </div>
                </div>
            </div>
            </div>
        </div></div></div></div></div>
        <div id='cont_b'><div id='cont_r'><div id='cont_l'><div id='corner_br'><div id='corner_bl'>
        <div id='cont' class='clearfix $main_style'>
            ".(LEFT ? "<div id='side-border-left'>".LEFT."</div>" : "")."
            ".(RIGHT ? "<div id='side-border-right'>".RIGHT."</div>" : "")."
            <div id='main-bg'><div id='container'>".
                U_CENTER.
                CONTENT.
                L_CENTER."
            </div></div>
        </div>
        </div></div></div></div></div>
        <div id='footer' class='clearfix'>
            ".(!$license ? "<div class='flleft' style='width: 50%'>".showcopyright()."<br />\n Theme designed by <a href='http://matonor.com'>Max Toball</a></div>" : "")."
            <div class='flright' style='width: 50%; text-align: right;'>".stripslashes($settings['footer'])."</div>\n";
    echo "\t</div>
        <div id='subfooter' class='clearfix'>
            <div class='flleft' style='width: 50%'>".sprintf($locale['global_172'], substr((get_microtime() - START_TIME),0,4))."</div>
            <div class='flright' style='width: 50%; text-align: right;'>".showcounter()."</div>
        </div>
    </div>";

}

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

global $locale;

opentable($subject);
echo "<div class='floatfix'>".$news."</div>
<div class='news-footer'>
    ".newsposter($info," &middot;").newsopts($info,"&middot;").itemoptions("N",$info['news_id']).
"</div>\n";
closetable();

}

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

global $locale;
   
opentable($subject);
echo "<div class='floatfix'>".($info['article_breaks'] == "y" ? nl2br($article) : $article)."</div>
<div class='news-footer'>
    ".articleposter($info," &middot;").articleopts($info,"&middot;").itemoptions("A",$info['article_id']).
"</div>\n";
closetable();
}

function opentable($title) {

echo "\n<div class='panel'><h2 class='panelcap'><span><span>$title</span></span></h2>
    <div class='panelbody'><div class='panel_r'><div class='panel_l'>\n";

}

function closetable() {

echo "</div></div></div></div>\n";

}

$panel_collapse = true;
function openside($title, $collapse = false, $state = "on") {
   
static $box_id = 0; $box_id++;
global $panel_collapse, $p_data; $panel_collapse = $collapse;

if($p_data['panel_filename'] == "css_navigation_panel"){
    $panel_collapse = false;
    echo "<div class='panelbody navigation'><div class='navcap_r'><div class='navcap_l'><div class='panel_r'><div class='panel_l'>";
}else{
    echo "<h3 class='panelcap'><span><span>".($collapse ? panelbutton($state,$box_id) : "")."$title</span></span></h3>
<div class='panelbody'><div class='panel_r'><div class='panel_l'>\n\t".($collapse ? panelstate($state, $box_id) : "");
}
}

function closeside() {

global $panel_collapse, $p_data;

echo ($panel_collapse ? "\t</div>" : "")."\n</div></div></div>\n";

if($p_data['panel_filename'] == "css_navigation_panel"){
    echo "</div></div>";
}

}
?>

เหอๆๆๆ   ถามซ้ำซากอีกครั้งครับ  พี่ ต้องใส่ ค่า ลงไปเท่าไหร่ครับ    100  %   เหรอครับ    แบบ  งง จริงๆ  5555+

แก้ไขล่าสุดโดย jeabkorea (2010-09-01 13:00:20)

ขอบคุณครับ  ได้แล้วครับ  แต่ว่า ใส่ <center> </center>  จัดให้มันอยู่ตรงกลางใส่ตรงไหนครับ  ลองใส่ ดู หลายๆ ที่แล้ว  มั่วไปหมดเลยครับ  555+

แล้ว ตัวนี้ของบอร์ด นี่ จะหามาติดตั้งได้ยังไงครับ 

พี่ใส่แล้ว ก็ยังอยู่ ชิดซ้ายเหมือนเดิมครับ  ลองดูให้หน่อยว่าใส่ถูกรึเปล่า

แล้วนี่เป็นโค้ทของ styles.css  ของทีมที่ใช้อยู่

/*Phos Theme for PHP-Fusion 7 by Max "Matonor" Toball*/

/*General*/
html {font-size: 85%;}
body {
    color: #3d3d3d;
}
* {
    font-family: "MS Sans Serif", Tahoma,  Verdana, Arial, Sans, sans-serif;
    margin: 0;
    padding: 0;
    border: 0;
    font-size: 1em;
}
ul, ol, dl {margin: 0.5em 1em}
li {margin-left: 1.5em; line-height: 1.5em;}
option {padding-left: 0.75em}
#subheader ul, #subheader li, #userbar ul, #userbar li, #navigation ul, #navigation li {margin: 0; line-height: inherit;}

/*Links*/
a {text-decoration: none;}
#subheader a, #links a{
    color: #fff;
    text-decoration: none;
}
#subheader a{
    display: block;
    float: left;
    color: #242424;
    margin: 0 0.4em;
    background: #969696 url(images/navtab_bg.jpg) repeat-x top right;
}
* html #subheader a {margin: 0 0.2em;}
#subheader a span{
    display: block;
    float:left;
    height: 2em;
    line-height: 2em;
    padding: 0 0.5em;
    background: transparent url(images/navtab_l.jpg) no-repeat top left;
}
#subheader a:hover, #subheader .active a{
    background: #d1d1d1 url(images/navtab_hbg.jpg) repeat-x top right;
}
#subheader a:hover span, #subheader .active span{
    background-image: url(images/navtab_hl.jpg);
}
#links a{
    line-height: 1.6em;
    height: 1.6em;
    font-size: 0.9em;
    margin-right: 0.3em;
}
#links a:hover {
    color: #ccc;
}
#footer a {
    color: #fff;
}
#anchors a {
    line-height: 1.6em;
    font-size: 1em;
    color: #444;
    margin-left: 0.5em;
}
#anchors a:active, #anchors a:focus, #anchors a:hover{color: #fff;}
.admin-message a{
    color: #fff;
    text-decoration: underline;
}

/*Structure*/
#header{
    padding: 13px 13px 0 13px;
}
#header_bg{
    position: relative;
    background: #242424 url(images/header_bg.jpg) no-repeat bottom right;
}
#subheader{
    float: left;
    height: 1.9em;
    overflow: hidden;
}
#subheader ul{
    display: table;
    white-space: nowrap;
    right: 0 !important;
    padding: 0 !important;
}
#subheader li{
    display: table-cell;
}
#mainheader{text-align: center !important;
    padding: 0.5em;
}
#userbar{
    height: 1.8em;
    position: relative;
    font-family: "MS Sans Serif", Tahoma,  "Trebuchet MS", "Lucida Grande", sans-serif;
}
#userbar ul li, #subheader ul li {
    float: left;
    list-style: none;
}
#links{
    position: absolute;
    right: 0.5em;
    top: 0;
}
#tab{
    position: absolute;
    right: -13px;
    bottom: 0;
    margin-top: 0.1em;
    width: 210px;
    height: 23px;
    background: transparent url(images/tab_l.gif) repeat-x bottom left;
}
#tab_r{
    height: 23px;
    line-height: 23px;
    padding: 0 1em;
}
#footer {
    width: 90%;
    color: #ccc;
    border: 1px solid #ccc;
    margin: 1.5em auto;
    padding: 1em;
    font-size: 0.8em;
}
#subfooter{
    width: 90%;
    margin: 0.5em auto;
    color: #fff;
    font-size: 0.8em;
}
#main {
    left: 0;
    position: absolute;
    top: 10px;
}
#cont{
    margin: 0 1em 1em 1em;
    background: #d1d1d1;
}
#corner_bl{padding-bottom: 5px;}
*+html #corner_bl{padding-bottom: 0em; overflow: hidden;}
* html #corner_bl{padding-bottom: 0;}
#main-bg {
    line-height: 1.45em;
    padding: 1em 0.25em;
}
* html #main-bg, * html #cont{
    height: 1%;
    width: auto;
    background: transparent;
}
#side-border-left {
    width: 15em;
    max-width: 15em;
    padding: 1em 0.75em;
    float: left;
    display: inline;
}
#side-border-right {
    width: 15em;
    max-width: 15em;
    padding: 1em 0.75em;
    float: right;
    display: inline;
}
.side-both #main-bg {margin: 0 16.5em;}
.side-left #main-bg {margin: 0 0.5em 0 16.5em;}
.side-right #main-bg {margin: 0 16.5em 0 0.5em;}

/*Navigation Panel*/
#navigation{ margin: -0.4em; }
#navigation h2, .side-label {
    color: #fff;
    font-size: 1.1em;
    padding: 0.25em;
    margin-bottom: 1px;
    font-weight: 700;
}
#navigation ul {
    margin: 0;
    display: block;
    list-style-type: none;
    line-height: 1.2em;
}
#navigation .bullet {display: none;}
* html #navigation ul li, #navigation a {height: 1%;}
#navigation a {
    background-color: #ede9e4;
    display: block;
    text-decoration : none;
    margin-bottom: 1px;
}
#navigation a span{
    color: #fff;
    display: block;
    height: 1.7em;
    line-height: 1.7em;
    padding: 0 0.5em;
}
#navigation a:hover {color: #fff;}

/*Misc Styles*/
.pagenav {padding: 0.4em;}
.pagenav span, .pagenav a, .pagenav a:hover {
    color: #ccc;
    border: 1px solid #ccc;
    padding: 0.2em 0.4em 0.2em 0.4em;
    margin: 0.2em;
    text-decoration: none;
}
.pagenav a {
    color: #333;
}
.switcherbutton{
    height: 16px;
    width: 16px;
}
.panelbutton{
    margin: 0.5em 0;
}
.textbox, .button {
    border-width: 1px;
    font-size: 1em;
    margin-top: 0.1em;
    padding: 0.25em;
}
.textbox{
    border-style: inset;
}
.button{
    color: #fff;
    border-style: outset;
    font-weight: bold;
}
.bbcode{
    background: #f0f0f0;
    border: 1px solid #ccc;
}
.news-category {
    float: left;
    margin: 0.2em 0.5em 0 0;
}
.news-footer-img {vertical-align: middle;}
.panelcap {
    font-family: "MS Sans Serif", Tahoma,  "Trebuchet MS", "Lucida Grande", sans-serif;
    color: #fff;
    font-size: 1.2em;
    line-height: 1.75em;
    display: block;
    height: 1.75em;
    font-weight: 500;
    background: #242424 url(images/panelcap_bg.jpg) repeat-x top;
}
.panelcap span {
    display: block;
    background: transparent url(images/panelcap_r.jpg) no-repeat top right;
}
.panelcap span span {
    display: block;
    padding: 0 0.75em;
    background: transparent url(images/panelcap_l.jpg) no-repeat top left;
}
.navcap_r{
    margin: -1px -1px 0 0;
    background: transparent url(images/navcap_r.jpg) no-repeat top right;
}
.navcap_l{
    margin: -1px 0 0 -1px;
    background: transparent url(images/navcap_l.jpg) no-repeat top left;
}
.panelbody {
    z-index: 1000;
    background: #f7f7f7 url(images/panelbody_bg.jpg) repeat-x bottom;
    margin-bottom: 1em;
    border-bottom: 1px solid #b0b0b0;
    border-left: 1px solid #fff;
    border-right: 1px solid #c7c7c7;
}
.panel_r{
    margin: 0 -1px -1px 0;
    background: transparent url(images/panelbody_r.jpg) no-repeat bottom right;
}
.navcap_r .panel_r{margin: 0 0 -1px 0;}
.panel_l{
    margin: 0 0 -1px -1px;
    padding: 0.75em;
    background: transparent url(images/panelbody_l.jpg) no-repeat bottom left;
}
.navcap_l .panel_l{margin: 0 0 -1px 0;}
.quote,.admin-message {
    border: 1pt solid #999;
    margin: 0 2em;
    padding: 3pt;
}
.admin-message{
    color: #fff;
    padding: 0.5em;
    margin: 1em auto;
    width: 80%;
}
code, pre {
    font-family: "MS Sans Serif", Tahoma,  monospace;
    font-size: 1.1em;
}
.poll {height: 1em; border: 1px solid #000; background: #333;}
.shoutboxname, .comment-name {font-weight: 700;}
.shoutboxdate {
    color: #888;
    font-size: 0.8em;
}
.small,.small2,.side-small {font-size: 0.9em;}
.tbl-border{
    background: #f5f2eb;
    border: 1px solid #f5f2eb;
}
.tbl,.tbl1,.tbl2,.forum-caption {padding: 3pt;}
.forum-caption {
    color: #666;
    font-variant: small-caps;
    font-weight: 700;
    background: #ddd;
}
.tbl1 {background: #e6e6e6;}
.tbl2 {background: #e1e1e1;}
hr {
    border: solid #999 1pt;
    height: 1pt;
}
.news-footer {padding: 0.5em;}
.panelbutton{float: right;}
h1,h2,h3,h4,h5,h6 {font-size: inherit;}

/*Helpers*/
.center {margin: 0 auto;}
.content_center {text-align: center;}
.flleft {float: left !important;}
.flright {float: right !important;}
.clear {clear: both;}

#container{
    width: 100%;
    overflow-x: auto;
    overflow-y: visible;
}

/*IE Fixes*/
* html #main-bg {
    height: 1%;
    width: auto;
}
.clearfix:after {
    content:".";
    display:block;
    height:0;
    clear:both;
    visibility:hidden;
}
/* Hide from IE Mac \*/
.clearfix {display:block;}
/* End hide from IE Mac */
.floatfix {overflow:hidden;}
* html .floatfix {width:100%;}
.center, *[align="center"] {margin: 0 auto;}

เอ๋า คนละเรื่องเดียวกัน นึกว่าหมายถึง header ครับ เลยว่าไปอย่างนั้น
งั้นเอาใหม่ครับ
ใน
#main ลบ
position: absolute;
เพิ่ม
margin: auto;

แปลว่า จะให้มันจัดกลางโดยอัตโนมัติ

แต่ยังไม่จบ ที่ themes.php ต้องเอา

left: 50%; margin-left: -47.5%;

ออกไปด้วย เพราะว่าตัวนี้มันจัด ใส่ css ที่โค้ดด้วยอีกที