Elargir menu de droite
Elargir la colone de droite
Créations de Thèmes
Visiteur
je viens d'installer le CMS phpBoost que je trouve très intéressant,
j'ai rencontré un prblème que je n'arrive pas à résoudre seul,
je souhaiterais élargir la colone de droite en largeur.
Je ne vais pas vous cacher que j'ai déja chercher sur votre Support ainsi que dans mon FTP dans Design.php
ainsi que dans Global.php mais malgré plusieur modifications aucun resultat obtenue...
Je suis sur la Version 3.0 complète avec le thème " Hiver " d'installer.
Je vous met un Screen de ce que je souhaiterais faire, les bandes rouge represente la largeur que je souhaiterais.
Merci d'avance de votre soutient.
Édité par Visiteur Le 29/01/2010 à 13h09
ReidLos Membre non connecté
-
Modérateur
- Voir le profil du membre ReidLos
- Inscrit le : 27/02/2009
- Site internet
- Groupes :
-
Equipe Développement
et : http://www.phpboost.com/wiki/le-content-css#paragraph_les-minis-modules
Ca devrait déjà t'aider sur ce point... il va falloir que tu joue sur les width
infoking1 Membre non connecté
-
Booster Missile
- Voir le profil du membre infoking1
- Inscrit le : 29/09/2008
- Site internet
- Groupes :
/templates/TonTheme/theme/design.css
Code CSS :
/*##### Menu de gauche ###### */ div#left_menu { float:left; width:200px; margin:0; margin-top:0px; margin-right:2px !important; margin-right:-1px; padding:0; } /* ##### Menu droit ###### */ div#right_menu { float:right; width:300px; margin:0; margin-top:0px; margin-left:0px !important; margin-left:7px; }
et dans le /templates/TonTheme/theme/content.css
Code CSS :
/* Modules minis --------------------------------------*/ .module_mini_container { /*Placement des mini modules */ border:1px solid lightgrey; border-spacing:7px; margin:0 0 10px -5px; width:305px; }
Visiteur
les images ne s'affiche plus
Voici un Screen :
Et voici le code que j'ai modifier de Design.php et Content.php :
content.css :
Code TEXT :
/* --------------------------------------
content.css
Contient les formulaires, les modules (et modules minis), et messages.
--------------------------------------*/
table {
border-spacing:0px;
border-collapse:collapse;
}
/* Conteneur */
div.block_container {
width:auto;
margin:10px auto;
border:1px #cccccc solid;
background:#FFF url(images/contentbg.png) repeat-x;
/*-moz-border-radius:12px;
-khtml-border-radius:12px;
-webkit-border-radius:12px;
border-radius:12px;*/
}
div.block_contents {
width:auto;
padding:10px;
border:none;
text-align:justify;
}
/* Entête de conteneur et des tableaux */
div.block_top, table tr:first-child th {
padding:5px 6px;
color:#FFFFFF;
background:#003366 url(images/msg_top_row.png) repeat-x;
text-align:left;
font-size:0.75em;
font-weight:bold;
text-transform:uppercase;
}
.block_top {
margin-top:-1px;
-moz-border-radius:4px 4px 0px 0px;
-khtml-border-radius:5px;
-webkit-border-radius:5px;
border-radius:5px;
}
table th:first-child{
-moz-border-radius-topleft:4px;
-khtml-border-radius-topleft:5px;
-webkit-border-top-left-radius:5px;
border-radius:5px;
}
table th:last-child{
-moz-border-radius-topright:4px;
-khtml-border-radius-topright:5px;
-webkit-border-top-right-radius:5px;
border-radius:5px;
}
hr {
background:#C4CED6;
border:none;
margin:1px auto;
height:1px;
width:99%;
}
ul.list {
text-align:left;
margin-left:20px;
list-style-image: url(images/li.png)
}
/* Titres */
h1 {
color:#5C5C5C;
font-size:18px;
}
h2.title {
font-size:16px;
font-weight:bold;
}
/* Titres */
h3.title {
color:#003366;
font-size:12px;
font-weight:bold;
display:inline;
}
/* Sous-Titres */
h5.sub_title { /* Titre des menu */
font-size:12px;
color:#003366;
}
h6.sub_title2 { /* Sous titre dans les menu */
font-size:12px;
font-weight:bold;
padding-top:4px;
text-indent:10px;
width:155px;
height:32px;
color:#515C68;
}
/* Formulaires
--------------------------------------*/
.fieldset_mini {
width:540px;
margin:auto;
margin-top:20px;
}
input, textarea, optgroup, select, .xmlhttprequest_preview{
font-family:"Lucida Grande","Lucida Sans Unicode",Verdana,'Bitstream Vera Sans',Times,serif;
font-size:11px;
vertical-align:middle;
border-left:1px solid #6993AE;
border-top:1px solid #6993AE;
border-right:1px solid #CCCCCC;
border-bottom:1px solid #CCCCCC;
background-color:#FFFFFF;
color:#2E3B5F;
padding:1px 2px;
}
input:hover, textarea:hover{
border:1px solid #213D4F;
background-color:#FFFFFF;
}
input:focus, textarea:focus{
border:1px solid #0B6ABF;
background-color:#f5fbff;
}
fieldset textarea.post {
width:90%;
display:inline;
}
textarea {
display:block;
width:94%;
margin:auto;
-moz-border-radius:5px;
-khtml-border-radius:5px;
-webkit-border-radius:5px;
}
input.text{
padding:2px;
-moz-border-radius:3px;
-khtml-border-radius:3px;
-webkit-border-radius:3px;
}
input.submit{
padding:1px 2px;
font-family:Verdana, 'Bitstream Vera Sans', Times, serif;
border:1px solid #515C68;
border-top:1px solid #8498ae;
color:#515C68;
font-weight:bold;
font-size:10px;
background:#A9CEE9 url(images/form.png) repeat-x;
-moz-border-radius:5px;
-khtml-border-radius:5px;
-webkit-border-radius:5px;
border-radius:5px;
}
input[type=checkbox] {
border:none;
background:none;
}
input.file{
border:1px solid #515C68;
border-top:1px solid #8498ae;
color:#2E3B5F;
padding:1px;
font-weight:bold;
font-size:10px;
}
input.reset{
padding:1px 2px;
font-family:Verdana, 'Bitstream Vera Sans', Times, serif;
border:1px solid #515C68;
border-top:1px solid #8498ae;
color:#E10000;
font-weight:bold;
font-size:10px;
background:url(images/form.png) repeat-x;
-moz-border-radius:5px;
-khtml-border-radius:5px;
-webkit-border-radius:5px;
border-radius:5px;
}
input.reset:hover, input.submit:hover{
border:1px solid #11365f;
cursor:pointer;
color:#3776ba;
}
optgroup, select{
font-family:"Lucida Grande","Lucida Sans Unicode",Verdana,'Bitstream Vera Sans',Times,serif;
cursor:pointer;
vertical-align:middle;
width:auto;
-moz-border-radius:3px;
-khtml-border-radius:3px;
-webkit-border-radius:3px;
}
optgroup {
font-weight:bold;
border:none;
border-bottom:1px solid #5B5A5A;
}
option {
padding:0px 3px;
}
legend {
padding:1px 0;
font-family:"Lucida Grande","Lucida Sans Unicode",Verdana,'Bitstream Vera Sans',Times,serif;
font-size:0.85em;
font-weight:bold;
background:#D2E3F1;
border:1px solid #CCCCCC;
padding:2px 10px;
margin-top:-0.4em;
margin-left:0.5em;
position:relative;
text-transform:none;
line-height:1.5em;
color:#333333;
top:0;
vertical-align:middle;
text-transform:uppercase;
-moz-border-radius:3px;
-khtml-border-radius:3px;
-webkit-border-radius:3px;
}
* html legend {
margin:0 0 -10px -7px;
line-height:1em;
font-size:.85em;
}
fieldset{
font-family:"Lucida Grande","Lucida Sans Unicode",Verdana,'Bitstream Vera Sans',Times,serif;
margin:20px 0;
padding:6px;
border:1px solid #CCCCCC;
color:#445766;
background:#eceeef;
position:relative;
-moz-border-radius:5px;
-khtml-border-radius:5px;
-webkit-border-radius:5px;
}
fieldset.fieldset_submit{
margin-top:-10px;
padding-bottom:15px;
width:99%;
text-align:center;
background:none;
border:none;
}
fieldset.fieldset_submit legend {
display:none;
}
fieldset dl {
height:1%;
overflow:hidden;
margin-bottom:16px;
font-size:11px;
}
fieldset dl.overflow_visible {
overflow:visible;
}
html>body fieldset dl {
height:auto;
min-height:20px;
}
fieldset dt {
width:45%;
text-align:left;
padding-top:3px;
}
fieldset dd {
margin:0 0 0 45%;
padding:0 0 0 5px;
border:none;
vertical-align:top;
font-size:11px;
}
dt {
float:left;
width:auto;
}
dt span {
padding:0 5px 0 0;
}
label {
cursor:pointer;
}
fieldset label {
font-size:11px;
text-align:left;
font-weight:bold;
color:#1F507F;
}
dd label {
white-space:nowrap;
margin:0 10px 0 0;
font-weight:normal;
color:#476A7F;
}
dt span {
font-size:10px;
color:#476A7F;
}
label img {
vertical-align:middle;
}
fieldset dl dd label:hover {
color:#183A4F;
}
/* Messages postés par les membres (messages privés, commentaires, etc...)
--------------------------------------*/
/* Classe du lien du pseudo des messages */
a.msg_link_pseudo {
font-size:10px;
color:#FFF;
font-weight:bold;
}
a.msg_link_pseudo:hover {
}
.msg_position { /* Conteneur des messages */
width:98%;
margin:auto;
background:#DDD url(images/border.png) repeat-y left;
}
.msg_container,.msg_container2 {
/* Case contenant l'ensemble du message */
background:#FFF url(images/border.png) repeat-y right;
margin-left:1px;
overflow:hidden !important;
height:auto !important;
overflow:visible;
height:1%;
clear:both;
}
.msg_container2 {
/* Case contenant l'ensemble du message => Couleur alternative */
background:#EEE url(images/border.png) repeat-y right;
}
/* Barre supérieur des messages */
.msg_top_l{
margin-right:0px !important;
margin-right:-3px;
height:34px;
width:29px;
background:transparent url(images/msg_top_l.png) no-repeat left;
float:left;
}
.msg_top_r{
margin-left:0px !important;
margin-left:-3px;
height:34px;
width:21px;
background:transparent url(images/msg_top_r.png) no-repeat right;
float:right;
}
.msg_top {
height:25px;
background:transparent url(images/msg_top.png) repeat-x;
padding-left:6px;
margin-left:20px;
margin-right:15px;
padding-top:9px;
}
.msg_top a {
color:#FFFFFF;
}
.msg_pseudo_mbr { /* Pseudo du membre */
width:127px;
/*background:#CCCC99 url(images/msg_top_row.png) repeat-x;*/
background:#003366;
border-right:1px solid #FFF;
padding:2px 4px;
float:left;
margin-right:0px !important;
margin-right:-3px;
margin-left:-127px !important;
margin-left:-64px;
margin-top:-4px;
}
.msg_top_row {
/* Case au dessus du message, indique la date et les boutons d'administration */
height:16px;
background:#003366 url(images/msg_top_row.png) repeat-x;
font-size:10px;
color:#FFF;
font-weight:bold;
margin-right:1px;
border-top:1px solid #FFF;
border-bottom:1px solid #FFF;
padding-top:4px;
padding-left:127px;
overflow:hidden !important;
height:auto !important;
overflow:visible;
height:1%;
}
.msg_info_mbr { /* Case des informations du membre */
background:#DDD;
width:127px;
padding:4px;
float:left;
font-size:10px;
border-right:1px dotted #DDD;
}
.msg_contents_container {
/* Case contenant l'ensemble du message, infos membre + contenu */
margin-right:1px;
background:#E3EDF5;
}
.msg_contents,.msg_contents2 { /* Case du message */
margin-left:135px;
background:#FFFFFF;
padding:0px 5px;
border-left:1px dotted #C4CED6;
}
.msg_contents2 { /* Case du message => Couleur alternative */
background:#eee;
}
.msg_contents_overflow {
/* Case du contents du message, évite que les images trop grandes déforme */
width:99%;
height:auto;
min-height:80px;
overflow:auto;
padding:10px 0px;
}
.msg_sign,.msg_sign2 { /* Signature du membre */
background:#FFFFFF url(images/border.png) repeat-y right;
padding:4px;
font-size:11px;
margin-left:136px;
border-left:1px dotted #C4CED6;
}
.msg_sign2 { /* Signature du membre => Couleur alternative */
background:#eee url(images/border.png) repeat-y right;
}
.msg_sign_overflow { /* Signature du membre, fixe la hauteur maximale */
height:auto !important;
height:80px;
width:99%;
max-height:80px;
max-width:99%;
overflow:hidden;
}
.msg_bottom_l { /* Barre inférieure des messages */
}
.msg_bottom_r {
}
.msg_bottom {
height:23px;
background:#FFFFFF;
padding-top:6px;
padding-left:6px;
border:1px solid #CCCCCC;
border-top:1px dotted #C4CED6;
}
/* Modules
--------------------------------------*/ /* Conteneur des modules */
.module_position {
width:98%;
margin:auto;
-moz-border-radius-bottomleft:12px;
-moz-border-radius-bottomright:12px;
-moz-border-radius-topleft:12px;
-moz-border-radius-topright:12px;
background:#FFF url(images/content_module_top.png) repeat-x scroll 0 0;
border:1px solid #CCC;
}
.module_top_l { /* Barre supérieure des modules */
}
.module_top_r {
}
.module_top {
height:18px;
text-indent:10px;
font-size:12px;
font-weight:bold;
color:#003366;
padding-top:30px;
}
.module_top a {
}
.module_contents { /* Contenu des modules */
padding:20px 15px;
padding-bottom:15px;
clear:both;
text-align:justify;
color:#003366;
}
.module_bottom_l { /* Barre inférieure des modules */
}
.module_bottom_r {
}
.module_bottom {
height:22px;
padding-top:2px;
padding-left:6px;
font-size:12px;
}
/* Tableau global, utilisé dans les différents modules */
.module_table {
width:98%;
margin:auto;
border-spacing:0px;
border-collapse:separate;
padding:0px;
border:1px solid #CCCCCC;
-moz-border-radius:5px;
-khtml-border-radius:5px;
-webkit-border-radius:5px;
border-radius:5px;
}
*+html .module_table { /* Hack ie7 */
border-collapse:collapse;
}
/* Modules minis
--------------------------------------*/
.module_mini_container { /*Placement des mini modules */
border:1px solid lightgrey;
border-spacing:7px;
margin:0 0 10px -5px;
width:305px;
}
.module_mini_container a{
color:#003366;
}
.module_mini_container :hover{
color:#003366;
}
.module_mini_top {
height:24px;
font-weight:bold;
text-align:center;
}
.module_mini_contents {
border-top:none;
border-bottom:none;
text-align:center;
padding:4px;
padding-top:5px;
padding-bottom:0px;
color:#003366;
}
.module_mini_bottom { /* Bordure inférieure des modules minis */
background:transparent url(images/module_bottom.png) no-repeat scroll 0 0;
height:42px;
margin-bottom:-5px;
margin-left:-5px;
margin-right:-5px;
}
.label {
font-weight:bold;
font-size:11px;
color:#476a7f;
}
design.css :
Code TEXT :
/* --------------------------------------
design.css
Contient les conteneur, fortement dépendant du design.
--------------------------------------*/ /* Corps du site
--------------------------------------*/
* {
margin:0;
padding:0;
font-size:100%;
}
body {
background:#EEE url(images/global.png) repeat-x;
font-size:12px;
font-family:"Lucida Grande", "Lucida Sans Unicode", Verdana, 'Bitstream Vera Sans', Times, serif;
color:#000;
margin:0;
padding:0;
}
/* Conteneurs
--------------------------------------*/
/* ##### Conteneur global du site ###### */
div#global {
Extensible
margin:auto 5px;
margin-bottom:15px;
width:auto;
margin:auto;
}
/* ##### Entéte de la page ###### */
div#header_container{
background:transparent url(images/header.png) no-repeat scroll center center;
height:216px;
margin-bottom:8px;
}
/* ##### Entéte de la page ###### */
div#header{
height:188px;
}
/* ##### Conteneur en dessous de l'entéte ###### */
div#sub_header{
height:27px;
padding:10px 0 0 5px;
}
/* Lien du subheader */
div#header .dynamic_menu h5.links {
background:none;
border:none;
color:#edfff0;
width:134px;
background:url(images/button.png) no-repeat;
padding:5px 0px;
font-size:11px;
margin-right:1px;
}
div#header .dynamic_menu h5.links:hover {
color:#edfff0;
cursor:default;
background:url(images/button_click.png) no-repeat;
}
div#header .dynamic_menu h5 a {
color:#FFFFFF;
text-decoration:none;
}
/* ##### Compteur de visites ###### */
div#compteur {
background:transparent url(images/compteur.png) no-repeat scroll 0 0;
color:#003366;
font-size:10px;
height:150px;
margin-right:35px;
padding-top:70px;
position:absolute;
right:0;
text-align:center;
top:21px;
vertical-align:middle;
width:121px;
}
/* ##### Menu de gauche ###### */
div#left_menu {
float:left;
width:200px;
margin:0;
margin-top:0px;
margin-right:2px !important;
margin-right:-1px;
padding:0;
color:#003366;
}
/* ##### Menu droit ###### */
div#right_menu {
float:right;
width:300px;
margin:0;
margin-top:0px;
margin-left:0px !important;
margin-left:7px;
}
/* ##### Contenu de la page ###### */
div#main {
width:auto;
min-width:450px;
overflow:hidden !important;
height:auto !important;
overflow:visible;
height:1%;
padding:0;
margin:0;
float:none;
}
/* ##### Contenu central ###### */
div#main_content {
width:auto;
margin-top:10px;
padding:20px 10px;
padding-top:5px;
border-spacing:1px;
/*-moz-border-radius-bottomleft:12px;
-moz-border-radius-bottomright:12px;
-moz-border-radius-topleft:12px;
-moz-border-radius-topright:12px;
background:#FFF url(images/content_module_top.png) repeat-x scroll 0 0;
border:1px solid #CCC; */
}
/* ##### Barre de lien rapide ###### */
div#links { /*width:96%;*/
text-indent:10px;
margin-bottom:20px;
margin-top:-20px;
height:30px;
padding-top:10px;
-moz-border-radius-bottomleft:12px;
-moz-border-radius-bottomright:12px;
-moz-border-radius-topleft:12px;
-moz-border-radius-topright:12px;
background:#FFFFFF url(images/content_module_top.png) repeat-x scroll 0 0;
border:1px solid #CCCCCC;
}
/* ##### Emplacement au dessus de contenu de la page ###### */
div#top_contents {
margin-top:8px;
margin-bottom:8px;
}
/* ##### Emplacement en dessous de contenu de la page ###### */
div#bottom_contents {
margin-top:8px;
margin-bottom:8px;
}
/* ##### Bloc au dessus du pied de page ###### */
div#top_footer {
clear:both;
padding:0.75em;
}
/* ##### Pied de page ###### */
div#footer {
height:30px;
clear:both;
margin:auto;
margin-top:0px;
padding:0px;
padding-top:36px;
padding-right:20px;
text-align:right;
background:#F5F4ED url(images/footer.png) repeat-x;
}
div#footer span {
color:#FFF;
font-size:10px;
}
div#footer span a {
color:#FFF;
font-size:10px;
}
/* ##### Liens rapides ###### */
div#links_vertical {
display:block !important;
display:none;
position:fixed;
background:url(images/vertical_menu_repeat.png) repeat-y;
top:45%;
margin-left:989px;
width:27px;
text-align:center;
padding-left:2px;
}
div#links_vertical_top {
width:29px;
background:url(images/vertical_menu_top.png) no-repeat;
text-align:center;
margin-left:-2px;
padding-top:8px;
}
div#links_vertical_central {
width:27px;
text-align:center;
margin-left:-2px;
padding:4px 0px;
}
div#links_vertical_bottom {
width:29px;
background:url(images/vertical_menu_bottom.png) no-repeat;
text-align:center;
height:32px;
margin-left:-2px;
}
.bglinks {
background:url(images/bgmenu_links.jpg) no-repeat bottom right;
margin:0px;
padding:0px;
list-style-type:none;
padding-bottom:7px;
margin-bottom:5px;
}
Comment puis-je remettre les images ?
Merci.
infoking1 Membre non connecté
-
Booster Missile
- Voir le profil du membre infoking1
- Inscrit le : 29/09/2008
- Site internet
- Groupes :
Visiteur
Je me suis acharner comme un dingue et j'ai enfin réussie il sufisait juste de modifier le width qui
se trouvait dans " content.css " et de le régler sur 300.
dernière question oui je sais je vous embêtes xD
Comment puis-je régler la largeur du Menu droit et du Gauche, genre le droit je souhaiterais
le régler a 300 ce qui est déja fait mais le gauche je souhaiterais le mètre a 200.
Voici le code en question :
Code TEXT :
/* Modules minis
--------------------------------------*/
.module_mini_container { /*Placement des mini modules */
width:300px;
margin:0px;
margin-bottom:10px;
background:#FFF url(images/contentbg.png) repeat-x;
border:1px #cccccc solid;
border-spacing:1px;
padding:5px;
-moz-border-radius:12px;
-khtml-border-radius:12px;
-webkit-border-radius:12px;
border-radius:12px;En gros je souhaiterais que mes module de gauche soit moin large par exemple leur mêtre un width
de 200.
infoking1 Membre non connecté
-
Booster Missile
- Voir le profil du membre infoking1
- Inscrit le : 29/09/2008
- Site internet
- Groupes :
Répondre
Vous n'êtes pas autorisé à écrire dans cette catégorie