Soucis design perso [Résolu] sidebar sur une seule page

[Venolex]

Bonjour la communauté,

Aujourd'hui je suis tombé sur un kit graphique qui m'as taper dans l’œil et je l'ai tout de suite installer, j'ai effectuer la mise en page et tout fonctionne comme prévu, jusqu’à ce que je me rende compte d'un petit problème avec le "content" et la "sidebar". En effet ils sont centrer et prennent la même largeur.

Voici ma question, serait-il possible de positionner la "sidebar" le plus à droit possible et de faire en sorte qu'elle prenne par exemple seulement 20% de la largeur du site, et de réserver le reste pour le "content"

Ensuite j'ai besoin de la "sidebar" sur une seul page, aurait-il un moyen de la cacher sur les autres page et de réserver la totalité de l'espace au "content" ?

Je suis "débroullaird" mais je vous avouerez que niveau CSS j'y connais absolument rien, je vais vous fournir le code HTML et CSS présent sur mon site, il est possible qu'il doit être "épuré"

Code:

<div id="wrapper">
    <div id="header">
        <div id="logo">
            <h1>
                <a href="index.html">Lawyer<span>&amp;</span>Attorney</a>
            </h1>
        </div>

        <div class="clr">
        </div>
    </div>

    <div class="content">
        <div style="margin-left: 2em" id="menu">
            <var levels="1,2,3" expand="false" variant="standard" edit="1">navigation</var>
        </div>

        <div class="col">
        </div>

        <div class="col last">
        </div>

        <div class="clr">
        </div>
    </div>

    <div id="main">
        <div class="col">
            <var>content</var>
        </div>

        <div class="col last">
            <var>sidebar</var>
            <div class="clr">
            </div>
        </div>

        <div id="footer">
            <p id="links">
            </p>

            <p>
                Copyright © 2010 − Lawyer&amp;Attorney · Design: Luka Cvrk, <a href="http://www.solucija.com" title="Free CSS Templates">Solucija</a> ¬ <a href=
                "http://www.lawyermarketinggroup.com/">Law Firm Marketing</a>
            </p>
        </div>
    </div>
    <var>footer</var>
</div>

Code:

/*
 template: Lawyer&Attorney
 author:   Luka Cvrk (www.solucija.com)
*/

* { margin: 0; padding: 0; }
body { font: .74em Tahoma, Verdana, Sans-Serif, Arial; background: url('http://u.jimdo.com/www79/o/s6a43eb98937b9bab/userlayout/img/body.gif?t=1441362539') repeat; color: #7f7f7f; }
h1 { font: normal 3.4em "Trebuchet MS", Helvetica, Arial; }
h2 { font: normal 1.8em "Trebuchet MS", Helvetica, Arial; color: #dfdfdf; margin: 0 0 15px; }
h3 { font: normal 1.4em "Trebuchet MS", Helvetica, Arial; margin: 0 0 20px; }
h4 { font: normal 1.2em "Trebuchet MS", Helvetica, Arial; color: #dfdfdf; margin: 0 0 4px; }
p { margin: 0 0 15px; line-height: 1.6em; }
a { outline: 0; color: #304D6F; text-decoration: none; }
li { list-style: none; }
li a, img { display: block; }
img { outline: 0; border: 0; }
#wrapper { width: 984px; margin: auto; }
.clr { clear: both; }
#logo { float: left; padding: 30px 15px; }
 #logo h1 a { color: #fff; }
 #logo h1 a span { color: #808080; }
#menu { height: 44px; padding: 5px 0 0 4px; }
 #menu li { float: left; font-size: 1.3em; text-transform: uppercase; }
 #menu li a { color: #888; margin: 0 50px 0 0; }
 #menu li a.current, #menu li a:hover { color: #fff; }
 #pitch { clear: both; background: url('http://u.jimdo.com/www79/o/s6a43eb98937b9bab/userlayout/img/logo.png?t=1435860277') no-repeat; height: 228px; margin: 0 0 30px; padding: 60px 360px 0 30px; }
 #pitch h1 { font-size: 2.4em; color: #304D6F; margin: 0 0 20px; }
 #pitch em { font-size: 1.3em; font-weight: bold; line-height: 1.6em; }
.content { background: url('http://u.jimdo.com/www79/o/s6a43eb98937b9bab/userlayout/img/content.gif?t=1441362547') repeat; padding: 20px; }
.link { background: #304D6F; color: #fff; padding: 5px 10px; font-size: .9em; }
#main { padding: 20px; }
.col { float: left; width: 292px; margin: 0 30px 15px 0; }
 .col.last { float: right; margin-right: 0; }
 .case img { float: left; clear: left; margin: 0 20px 20px 0; background: #121212; padding: 3px; }
 .short { padding: 0 0 15px 0; background: url('http://u.jimdo.com/www79/o/s6a43eb98937b9bab/userlayout/img/line.gif?t=1441362555') repeat-x left bottom; }
 .case a, .article a { color: #ddd; font-weight: bold; }
 .date { font-size: .84em; margin: 0 0 3px; }
#footer { clear: both; background: url('http://u.jimdo.com/www79/o/s6a43eb98937b9bab/userlayout/img/line.gif?t=1441362555') repeat-x; padding: 20px 20px 10px; font-size: .9em; }
 #footer a { color: #ccc; margin: 0 10px 0 0; border-bottom: 1px dotted #444; padding: 0 0 1px; }
 #links { float: right; }
 #links a { margin: 0 0 0 10px; }
 #footer p { margin: 0 0 8px; }

Si jamais vous avez besoin d'autre éléments je vous les donnerez.

Merci par avance de vôtre patience

[FredVig]

Si vous n'avez besoin de la sidebar sur une seule page, n'utilisez pas la sidebar.
Sur la page concernée, mettez un module colonnes, réglez l'espacement comme vous le désirez (80% - 20%), et insérez du texte et autre contenus dans ces colonnes.

[Venolex]

Merci de vôtre réponse !

Problème résolu !

[Contenu sponsorisé]