Descrizione: Con questa guida apporteremo delle modifiche ai file html è CSS per arrivare ad avere la colonna del profilo in viewtopic con dimensioni fisse.
Argomento sul com: clicca qui
Nota: Queste modifiche sono fatte sulla modifica viewtopic.php?t=149#p166, quindi facendo queste modifiche vi ritroverete anche il profilo a sinistra, ma e consigliato seguire la guida base Profili a Sinistra prima di apportare queste ulteriori modifiche.
Ecco come rendere il profilo con una larghezza fissa. Si richiedono modifiche al template
viewtopic_body.html
e al CSSIn primo luogo, apri
viewtopic_body.html
e trova il seguente:
Codice: Seleziona tutto
<div class="inner"><span class="corners-top"><span></span></span>
<div class="postbody">
Codice: Seleziona tutto
<div class="inner"><span class="corners-top"><span></span></span>
<div class="post-container">
<div class="postbody">
Codice: Seleziona tutto
<div class="back2top"><a href="#wrap" class="top" title="{L_BACK_TO_TOP}">{L_BACK_TO_TOP}</a></div>
Codice: Seleziona tutto
</div>
<div class="back2top"><a href="#wrap" class="top" title="{L_BACK_TO_TOP}">{L_BACK_TO_TOP}</a></div>
Codice: Seleziona tutto
<div class="postbody">
(Tutto il codice contenente)
</div>
Codice: Seleziona tutto
<div class="postbody">
(Tutto il codice contenente)
</div>
</div>
<div class="back2top"><a href="#wrap" class="top" title="{L_BACK_TO_TOP}">{L_BACK_TO_TOP}</a></div>
content.css
ed elimina le due regole seguenti:
Codice: Seleziona tutto
.search .postbody {
width: 68%
}
Codice: Seleziona tutto
/* Poster profile used by search*/
.search .postprofile {
width: 30%;
}
Codice: Seleziona tutto
.postbody {
padding: 0;
line-height: 1.48em;
color: #333333;
width: 76%;
float: left;
clear: both;
}
Codice: Seleziona tutto
.post-container {
margin-left: 210px;
}
.postbody {
padding: 0;
line-height: 1.48em;
color: #333333;
width: 100%;
clear: none;
}
Codice: Seleziona tutto
.postprofile {
/* Also see tweaks.css */
margin: 5px 0 10px 0;
min-height: 80px;
color: #666666;
border-left: 1px solid #FFFFFF;
width: 22%;
float: right;
display: inline;
}
.pm .postprofile {
border-left: 1px solid #DDDDDD;
}
.postprofile dd, .postprofile dt {
line-height: 1.2em;
margin-left: 8px;
}
Codice: Seleziona tutto
.postprofile {
/* Also see tweaks.css */
margin: 5px 0 10px -210px;
min-height: 80px;
color: #666666;
border-right: 1px solid #FFFFFF;
width: 200px;
float: left;
display: inline;
}
.pm .postprofile {
border-right: 1px solid #DDDDDD;
}
*+html .postprofile {
position: relative;
left: -210px;
}
.postprofile dd, .postprofile dt {
line-height: 1.2em;
}
Codice: Seleziona tutto
.online {
background-image: none;
background-position: 100% 0;
background-repeat: no-repeat;
}
Codice: Seleziona tutto
.online {
background-image: none;
background-position: 152px 0;
background-repeat: no-repeat;
}
Si prega di notare che
.online
regola CSS si suppone che si sta utilizzando l'icona di default online. Se hai cambiato l'icona, sarà necessario cambiare la .online
regola CSS di conseguenza. Si noti inoltre che questa modifica vale solo per lo stile Prosilver predefinito. Se si utilizza uno stile Prosilver modificato, allora si dovrebbe contattare l'autore di quello stile e chiedere come fare questi cambiamenti per quello stile.