Hello, I am having trouble adjusting the width of the grid on this page. The far right column of posts is currently cut off, and I am not sure where to look to fix this. Here is the code:
/* Grid Style */
#main-content #grid{width:1500px ; margin-left:5px;margin-right:5px;}, #main-content #content{margin: 10px 0px 10px 0px; padding:2px;}
#filters{float:left; border-bottom: 1px dotted #CCC; overflow:hidden;margin-top:0px; padding-left:10px;}
#filters li{float:left; margin:0px 0px 0px 0px;padding: 8px 8px 8px 8px;}
#filters li a {
text-decoration: none;
text-transform: none;
line-height: 12px;
color: black;
background-color:rgba(255,255,255,0.9);
float: left;
padding:8px 8px 8px 8px;
font-size:16px;
-moz-border-radius: 10px;
-webkit-border-radius:10px;
border-radius:5px;
}
#filters li.current a, #filters li a:hover {
color: white;
background:rgba(0,191,255,0.9);
-moz-border-radius: 10px;
-webkit-border-radius:10px;
border-radius:10px;
}
#main-content .item-list {
background-color:rgba(255,255,255,0.9);
border-radius: 5px;
-moz-border-radius: 5px;
-webkit-border-radius: 5px;
box-shadow: 2 2px 6px rgba(128,128,128,0.9);
-moz-box-shadow: 0 2px 3px rgba(128,128,128,0.8);
-webkit-box-shadow: 0 2px 3px rgba(128,128,128,0.8);
overflow:hidden;
margin:20px 15px 20px 0px;
width:350px;
float:clear:both;
}
Absolute? translate?
Do you have some compelling reason to use these methods of layout? Absolute positioning has any number of big-toothed gotchas just looking for butt to bite. The transform module of css3 is a working draft and is subject to change at any time, and vendors are in a testing stage; unstable.
The reason or one of the reasons for cut-off is the container for the columns being {overflow: hidden;}. When I tried to verify, I got an error message: 500 Internal Server Error. :shrug:
cheers,
gary