Problem with the colmun and style.css
-
Hi guys
I’ve a problem and I hope someone of you can help me.
On my website (www.zerogradinord.it) I need to change the width of the left and side columns.
Working on Style.CSS (you will find it after this introduction) I’ve change them from 165px to 185px (but I need more, something like 220px) but the left and right column come over the main container.
I had try to solve the problem writing in the content block: width:65%. Now, as you can see on my web page, the central column is not in the center, but it’s align on the left.
What I’ve to do to center the central column?
My dream is that if I change the width of the side columns, the center one will resize by itself and remain in the center…
Thanks a lot.Mauro
/* General Element Styling */
body {
background:#8b8b8b;
color:#ffffff;
font: 79% Verdana, sans-serif;
margin:0;
padding:0;
text-align:center;
}a {
text-color:#ffffff;
font-weight:bold;
text-decoration:none;
}a:hover {
color:#ff0000;
text-decoration:none;
}p {
line-height:1.5em;
margin:0 0 15px;
padding: 0px;
}/*** Main container ***/
#container {
color:#ffffff;
margin:0;
min-width:770px;
padding:0;
text-align:left;
width:100%;
}/*** Header section ***/
#sitename {
color:#000000; visibility: hidden;
height:90px;
margin:0 20px 40px;
text-align:left;
}#sitename h1,#sitename h2 {
font-weight:bold;
margin:0;
padding:0;
}#sitename h1 {
font-family:verdana;
font-size:4.4em;
font-weight:bold;
padding-top:10px;
}#sitename h1 a {
color: #000000;
font-style:italic;
text-decoration: none;
letter-spacing: 5px;
}#sitename h2 {
font-size:2.0em;
}/*** Content wrap ***/
#wrap {
clear:both;
font-size:0.9em;
padding:0;
margin-top: 5px;
}/* Horizontal menu */
#mainmenu {
clear: both;
width: 100%;
margin: 0px;
padding: 0px;
}#mainmenu ul.level1 {
border-top: 1px solid #000;
border-bottom: 1px solid #000;
}#mainmenu ul {
background: #000000 url(images/menubgzgn.jpg) center left repeat-x;
padding: 0 0 0 5px;
margin: 0px;
border-bottom: 1px solid #000;
}#mainmenu li {
background url(images/menubgblackzgn.jpg) center left repeat-x;
display: inline;
line-height: 25px;
margin-left: -4px;
padding: 0px;
font-size: 0.9em;
list-style: none;
text-transform: uppercase;
}#mainmenu a {
padding: 6px 9px 6px 9px;
text-decoration: none;
border-right: 1px solid #000000;
}#mainmenu li.current a {
color: #000;
}/*** Sidebars ***/
#leftside,#rightside {
margin:0;
padding:0 10px 10px;
width:185px;
}#leftside {
float:left;
margin-right:10px;
}#rightside {
float:right;
margin-left:10px;
}#rightside img {
border: 0px;
}/*** Sidebar menu ***/
#leftside h2, #rightside h2 {
font-size: 1.4em;
margin-top: 10px;
padding: 5px 5px 5px 0;
border-bottom: 1px solid #ffffff;
}#leftside ul, #rightside ul {
padding-left: 0px;
margin: 0px;
}#leftside li, #rightside li {
list-style: none;
}li#categories li a, li#archives li a, li.pagenav li a {
background:#000000;
border:1px solid #ffffff;
display:block;
margin-top:4px;
padding:5px 4px 4px 10px;
position:relative;
text-transform: capitalize;
width:140px;
}li#categories li a:hover, li#archives li a:hover, li.pagenav li a:hover {
background:#000000;
border:1px solid #909090;
color:#ffffff;
text-decoration:none;
}li#categories ul.children li a, li#archives ul.children li a, li.pagenav ul.children li a {
font-size:0.8em;
letter-spacing:1px;
margin:3px 0 2px 10px;
padding:4px 2px 2px 8px;
width:125px;
}li#categories ul.children li li, li#archives ul.children li li, li.pagenav ul.children li li {
padding-left: 10px;
}li#categories ul.children li li a, li#archives ul.children li li a, li.pagenav ul.children li li a {
width: 115px;
}li.feed {
background: url(images/rss.gif) no-repeat left top;
padding: 2px 0 8px 20px;
}li#recent-comments ul li {
padding-bottom: 5px;
}li#recent-posts ul li {
padding-bottom: 5px;
}/*** Content ***/
#content,#contentalt {
color:#f5f5f5;
background-color:#1d1d1d;
border:1px solid #000000;
color:#f5f5f5;
width:65%;
padding:15px 20px 5px;
}#content {
margin:0 200px;
}#contentalt {
margin:0 200px 0 20px;
}#content h1,#contentalt h1,#contentalt h2 {
background-color:inherit;
color:#ff0000;
font-size:1.8em;
font-weight:bold;
letter-spacing:-1px;
margin:0 0 15px;
padding:0;
}#content h1,#contentalt h1 {
border-bottom: 1px solid #b0b0b0;
}#content h2 {
font-size:1.6em;
color:#ffffff;
}/* Archives/Links Page List styles */
.archives li, .linkspage li {
list-style: none;
}.archives ul.children {
padding-left: 10px;
margin-left: 10px;
}/*** Footer ***/
#footer {
background:#000000;
clear:both;
color:#fff;
font-size:0.9em;
font-weight:bold;
margin:0;
padding:20px 0;
text-align:center;
width:100%;
}#footer a {
color: #ffffff;
font-weight:bold;
}/*** comments Form ***/
#comment {
width: 100%;
border:1px solid #000000;
}#commentform {
width: 97%;
}#author {
border:1px solid #000000;
}#email {
border:1px solid #000000;
}#url {
border:1px solid #000000;
}#submit {
background:#f0f0f0;
border:1px solid #000000;
}#submit:hover {
background: #e8e9ea;
border: 1px solid #848484;
cursor: pointer;
}/* Image Display */
.entry img, .entrytext img {
border: 1px solid #b0b0b0;
margin: 3px;
padding: 3px;
}.entry a:hover img, .entrytext a:hover img {
border: 1px solid #505050;
padding: 5px;
}img.wp-smiley {
border: 0px;
margin: 0px;
padding: 0px;
}.thumbnail {
background:#fafbfc;
border:1px solid #b0b0b0;
margin:0 0 10px 10px;
padding:5px;
}.left {
background:#fafbfc;
border:1px solid #b0b0b0;
float:left;
margin: 5px 15px 6px 0px;
padding:10px;
}.right {
background:#fafbfc;
border:1px solid #b0b0b0;
float:right;
margin: 5px 0px 6px 15px;
padding:5px;
}.noalign {
background:#fafbfc;
border:1px solid #b0b0b0;
margin: 5px 5px 5px 5px;
padding:5px;
}/* Search Form */
#searchform {
margin-top: 10px;
}#searchbox {
background:#ffffff;
border:1px solid #000000;
margin:0 4px 0 0;
width:180px;
}#searchbutton {
background:#f0f0f0;
border:1px solid #b0b0b0;
}#searchbutton:hover {
background: #e8e9ea;
border: 1px solid #848484;
cursor: pointer;
}/*** Comments Display ***/
.postmetadata {
background:#333333;
font-size: 0.9em;
border: 1px solid #ffffff;
padding: 10px;
margin: 0px;
}ol.commentlist li {
border: 1px solid #ffffff;
padding: 10px;
margin-bottom: 10px;
}ol.commentlist li cite {
text-transform: capitalize;
}ol.commentlist li p {
padding-top: 10px;
}.alt {
background:#333333;
}/*** Text format ***/
.intro {
font-size:1.1em;
font-weight:bold;
letter-spacing:-1px;
}blockquote {
border: 1px dashed #ffffff;
padding: 10px;
margin: 30px;
}blockquote p {
padding: 0px;
margin: 0px;
}.small {
font-size:0.8em;
}.large {
font-size:1.4em;
}.center {
text-align:center;
}.category {
border-bottom: 1px solid #ff0000;
}.date {
margin-top: -10px;
padding-top: 0px;
}#page {
border-bottom: 1px solid #ffffff;
padding-bottom: 10px;
margin-bottom: 10px;
}/* Previous/Next Page Navigation */
.navigation {
margin: 0 0 20px 0;
padding: 0 0 20px 0;
border-bottom: 1px #ffffff
}.bottomnavigation {
margin: 30px 0 0 0;
padding: 5px 0 30px 0;
border-top: 1px #ffffff
}.alignleft {
float: left;
text-align: left;
}.alignright {
float: right;
text-align: right;
}.post {
padding-top: 0px;
padding-bottom: 10px;
margin: 0px;
}/* Fix by Andy Skelton */
.entry, .entrytext {
overflow: hidden;
}* html.entry, * html.entrytext {
overflow: visible;
height: 1px;
}* html.entry p, * html.entrytext p {
width: 99%;
overflow: hidden;
}.entrytext {
padding-top: 0px;
}/*** Various classes ***/
.clearingdiv {
clear:both;
height:30px;
width:1px;
}.hide {
display:none;
}/* Widgets */
.rsswidget {
border:0px;
vertical-align: bottom;
}
/*** End of file ***/
- The topic ‘Problem with the colmun and style.css’ is closed to new replies.