Tom's Guide > Forum > Programmation > [Résolu] Augmenter largeur d'une colone

[Résolu] Augmenter largeur d'une colone

Forum Programmation : [Résolu] Augmenter largeur d'une colone

TomsGuide.com : 800 000 inscrits répondent à toutes vos questions high-tech et informatique. Pour obtenir de l'aide, inscrivez-vous gratuitement !

Créer un nouveau sujet Répondre

Lire la meilleure réponse, apportée par okinou.

Bas de page Chercher dans ce sujet

Bonjour,
voici mon problème :

L'espace mis en rouge : j'aimerais augmenter la largeur.
Le problème c'est que je ne sais pas comment faire.

J'ai ici le code html du modèle :

Code :

<?xml version="1.0" encoding="UTF-8" ?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html expr:dir='data:blog.languageDirection' xmlns='http://www.w3.org/1999/xhtml' xmlns:b='http://www.google.com/2005/gml/b' xmlns:data='http://www.google.com/2005/gml/data' xmlns:expr='http://www.google.com/2005/gml/expr'>
<head>
<b:include data='blog' name='all-head-content'/>
<title><data:blog.pageTitle/></title>
<b:skin><![CDATA[/*
* -----------------------------------------------
* Blogger Template Style
* Name: Mr. Moto Rising (Ellington style)
* Designer: Jeffrey Zeldman
* URL: www.zeldman.com
* Date: 23 Feb 2004
* Updated by: Blogger Team
* Page : Pierre Gourvès
* ----------------------------------------------- */
/* Variable definitions
====================
<Variable name="mainBgColor" description="Main Background Color"
type="color" default="#ffffff" value="#ffffff">
<Variable name="mainTextColor" description="Text Color"
type="color" default="#555555" value="#4c4c4c">
<Variable name="pageHeaderColor" description="Blog Title Color"
type="color" default="#ffffee" value="#ffffee">
<Variable name="blogDescriptionColor" description="Blog Description Color"
type="color" default="#ffffee" value="#ffffee">
<Variable name="linkColor" description="Link Color"
type="color" default="#999988" value="#999988">
<Variable name="hoverLinkColor" description="Link Hover Color"
type="color" default="#bbbbaa" value="#000000">
<Variable name="dateHeaderColor" description="Date Header Color"
type="color" default="#555544" value="#555544">
<Variable name="sidebarHeaderColor" description="Sidebar Title Color"
type="color" default="#555544" value="#555544">
<Variable name="sidebarTextColor" description="Sidebar Text Color"
type="color" default="#555555" value="#555555">
<Variable name="bodyFont" description="Text Font" type="font"
default="normal normal 100% 'tahoma Trebuchet MS', lucida, helvetica, sans-serif" value="normal normal 98% Trebuchet, Trebuchet MS, Arial, sans-serif">
<Variable name="startSide" description="Start side in blog language"
type="automatic" default="left" value="left">
<Variable name="endSide" description="End side in blog language"
type="automatic" default="right" value="right">
*/
/* Primary layout */
body {
margin: 0;
padding: 0;
border: 0;
text-align: center;
color: $mainTextColor;
background: #bba url(http://www.blogblog.com/moto_mr/outerwrap.gif) top center repeat-y;
font-size: small;
}
img {
border: 0;
display: block;
}
.clear {
clear: both;
}
/* Wrapper */
#outer-wrapper {
margin: 0 auto;
border: 0;
width: 692px;
text-align: $startSide;
background: $mainBgColor url(http://img185.imageshack.us/img185/9036/wrappernewqp7.png) top $endSide repeat-y;
font: $bodyFont;
}
/* Header */
}
#header h1 {
text-align: $startSide;
font-size: 200%;
color: $pageHeaderColor;
margin: 0;
padding-top: 15px;
padding-$endSide: 20px;
padding-bottom: 0;
padding-$startSide: 20px;
background-image: url(http://www.blogblog.com/moto_mr/topper.gif);
background-repeat: repeat-x;
background-position: top $startSide;
}
h1 a, h1 a:link, h1 a:visited {
color: $pageHeaderColor;
}
#header .description {
font-size: 110%;
text-align: $startSide;
padding-top: 3px;
padding-$endSide: 20px;
padding-bottom: 10px;
padding-$startSide: 23px;
margin: 0;
line-height:140%;
color: $blogDescriptionColor;
}
/* Inner layout */
#content-wrapper {
padding: 0 16px;
}
#main {
width: 400px;
float: $startSide;
word-wrap: break-word; /* fix for long text breaking sidebar float in IE */
overflow: hidden; /* fix for long non-text content breaking IE sidebar float */
}
#sidebar {
width: 226px;
float: $endSide;
color: $sidebarTextColor;
word-wrap: break-word; /* fix for long text breaking sidebar float in IE */
overflow: hidden; /* fix for long non-text content breaking IE sidebar float */
}
/* Bottom layout */
#footer {
clear: $startSide;
margin: 0;
padding: 0 20px;
border: 0;
text-align: $startSide;
border-top: 1px solid #f9f9f9;
}
#footer .widget {
text-align: $startSide;
margin: 0;
padding: 10px 0;
background-color: transparent;
}
/* Default links */
a:link, a:visited {
font-weight: bold;
text-decoration: none;
color: $linkColor;
background: transparent;
}
a:hover {
font-weight: bold;
text-decoration: underline;
color: $hoverLinkColor;
background: transparent;
}
a:active {
font-weight : bold;
text-decoration : none;
color: $hoverLinkColor;
background: transparent;
}
/* Typography */
.main p, .sidebar p, .post-body {
line-height: 140%;
margin-top: 5px;
margin-bottom: 1em;
}
.post-body blockquote {
line-height:1.3em;
}
h2, h3, h4, h5 {
margin: 0;
padding: 0;
}
h2 {
font-size: 130%;
}
h2.date-header {
color: $dateHeaderColor;
}
.post h3 {
margin-top: 5px;
font-size: 120%;
}
.post-footer {
font-style: italic;
}
.sidebar h2 {
color: $sidebarHeaderColor;
}
.sidebar .widget {
margin-top: 12px;
margin-$endSide: 0;
margin-bottom: 13px;
margin-$startSide: 0;
padding: 0;
}
.main .widget {
margin-top: 12px;
margin-$endSide: 0;
margin-bottom: 0;
margin-$startSide: 0;
}
li {
line-height: 160%;
}
.sidebar ul {
margin-$startSide: 0;
margin-top: 0;
padding-$startSide: 0;
}
.sidebar ul li {
list-style: disc url(http://www.blogblog.com/moto_mr/diamond.gif) inside;
vertical-align: top;
padding: 0;
margin: 0;
}
.widget-content {
margin-top: 0.5em;
}
/* Profile
----------------------------------------------- */
.profile-datablock {
margin-top: 3px;
margin-$endSide: 0;
margin-bottom: 5px;
margin-$startSide: 0;
line-height: 140%;
}
.profile-textblock {
margin-$startSide: 0;
}
.profile-img {
float: $startSide;
margin-top: 0;
margin-$endSide: 10px;
margin-bottom: 5px;
margin-$startSide: 0;
border:4px solid #ccb;
}
#comments {
border: 0;
border-top: 1px dashed #eed;
margin-top: 10px;
margin-$endSide: 0;
margin-bottom: 0;
margin-$startSide: 0;
padding: 0;
}
#comments h4 {
margin-top: 10px;
font-weight: normal;
font-style: italic;
text-transform: uppercase;
letter-spacing: 1px;
}
#comments dl dt {
font-weight: bold;
font-style: italic;
margin-top: 35px;
padding-top: 1px;
padding-$endSide: 0;
padding-bottom: 0;
padding-$startSide: 18px;
background: transparent url(http://www.blogblog.com/moto_mr/commentbug.gif) top $startSide no-repeat;
}
#comments dl dd {
padding: 0;
margin: 0;
}
.deleted-comment {
font-style:italic;
color:gray;
}
.feed-links {
clear: both;
line-height: 2.5em;
}
#blog-pager-newer-link {
float: $startSide;
}
#blog-pager-older-link {
float: $endSide;
}
#blog-pager {
text-align: center;
}
/** Page structure tweaks for layout editor wireframe */
body#layout #outer-wrapper {
padding-top: 0;
}
body#layout #header,
body#layout #content-wrapper,
body#layout #footer {
padding: 0;
}
]]></b:skin>
</head>
<body>
<div id='outer-wrapper'><div id='wrap2'>
<span id='skiplinks' style='display:none;'>
<a href='#main'>skip to main </a> |
<a href='#sidebar'>skip to sidebar</a>
</span>
<div id='header-wrapper'>
<b:section class='header' id='header' maxwidgets='1' showaddelement='no'>
<b:widget id='Header1' locked='true' title='Photobook (en-tête)' type='Header'/>
</b:section>
</div>
<div id='content-wrapper'>
<div id='crosscol-wrapper' style='text-align:center'>
<b:section class='crosscol' id='crosscol' showaddelement='no'>
<b:widget id='HTML3' locked='false' title='' type='HTML'/>
</b:section>
</div>
<div id='main-wrapper'>
<b:section class='main' id='main' showaddelement='no'>
<b:widget id='Blog1' locked='true' title='Messages blog' type='Blog'/>
</b:section>
</div>
<div id='sidebar-wrapper'>
<b:section class='sidebar' id='sidebar' preferred='yes'>
<b:widget id='Image1' locked='false' title='' type='Image'/>
<b:widget id='HTML1' locked='false' title='' type='HTML'/>
<b:widget id='BlogArchive2' locked='false' title='Archive de blog' type='BlogArchive'/>
<b:widget id='Label1' locked='false' title='[Tags]' type='Label'/>
<b:widget id='HTML4' locked='false' title='[Divertissons]' type='HTML'/>
</b:section>
</div>
<div class='clear'> </div>
</div>
<div id='footer-wrapper'>
<b:section class='footer' id='footer'>
<b:widget id='HTML2' locked='false' title='(c) exeworld' type='HTML'/>
</b:section>
</div>
</div></div>
</body>
</html>

Quelqu'un pourrait-il me dire quel élément modifier dans ce code pour augmenter la largeur de la colonne ?
Merci, c'est très important pour moi...

Message édité par exe22 le 02-01-2009 à 20:17:14

------------------------------ L'informatique c'est bien ... quand çà marche

Répondre

# #outer-wrapper {
# margin: 0 auto;
# border: 0;
# width: 692px;

ici je pensse, mesure déja en pixel la largeur, et tu trouvera la valeur correspondante ou approximative dans le css pour pouvoir le modifier.

Inscrivez-vous ou connectez-vous pour masquer ceci.

plop =)
regarde il doigt y avoir un fichier css avec , donne nous le code

------------------------------ XD --> peut aussi se dessiner --> XP
Microsoft se fout-il pas ne notre tete avec son XP ???
Répondre à andrelec1

Meilleure réponse

Répondre à okinou

J'ai finalement compris après avoir passé mon aprèm à observer tout ce texte ^^
J'ai donc agrandi ( avec les "width" ) Plusieurs balises "div", et j'ai tout réajusté.
Je vous remercie

------------------------------ L'informatique c'est bien ... quand çà marche
Répondre à exe22

Créer un nouveau sujet Répondre

Tom's Guide > Forum > Programmation > [Résolu] Augmenter largeur d'une colone

Aller à :

Aide |
Règles du forum

Il y a 646 utilisateurs connus et inconnus. Pour voir la liste des connectés connus, cliquez ici.

Page générée en 0,422 secondes

Attention

Vous allez répondre sur un sujet resté inactif pendant plus de 6 mois.
Assurez-vous d'apporter des éléments nouveaux à la discussion avant de poursuivre.

Répondre Annuler

Liens