Go into your style.css file, line 411, and change:
#content {
margin: 0 10% 0 0;
}
to:
#content {
margin: 0 22% 0 0;
}
Thread Starter
MikeDH
(@mikedh)
/* Wrapper */
#page {
margin: 20px auto;
max-width: 1000px;
overflow:hidden;
}
.site-content {
float: left;
width: 100%;
}
#content {
margin: 0 22% 0 0;
}
@media screen and (-webkit-min-device-pixel-ratio:0){ #content {
margin: 0 22% 0 0;
}} /*end safari hack */
@media screen and (-webkit-min-device-pixel-ratio:0){ .page #content, .single #content {
margin: 0 22% 0 0;
}} /*end safari hack */
#main .widget-area {
float: left;
overflow: hidden;
width: 20%;
}
#secondary { /* Sidebar 1 */
margin: 0 0 0 -20%;
width:18%;
}
I made this modification, but I’m still getting the overlap – This was to be made in the style.css under the theme I’m using, right?
Hmmm I’m still seeing line 411 showing “margin: 0 10% 0 0;” You are looking for a line that looks like:
@media screen and (-webkit-min-device-pixel-ratio:0){
#content {
margin: 0 10% 0 0;
}
} /*end safari hack */
You should know that this “issue” is only happening in Google Chrome. Other browsers render the issue proper. The style.css file is located in wp-content/themes/skirmish… so I think you are in the right file. There are a lot of weird “hacks” throughout your stylesheet which look to be the issue… but, who knows.
Look for that line with 10% right margin above and turn that to 22% and you should be all set.