WordPress网站文本在较小的屏幕宽度上重叠侧边栏



我正在帮助客户解决一个问题,即正文在较小的宽度上与侧边栏重叠,但是当它变得足够小时,侧边栏就会消失。您可以通过水平缩小窗口来查看重叠的文本。他们正在使用SimplePress主题。我还查看了样式表.css发现有很多错误指示器,但不确定是否是这些导致它。侧边栏CSS中的一个错误说:"使用带有左侧填充的宽度有时会使元素比您预期的要大。

知道这可能是什么吗?

编辑:我正在包括解决此问题的相关前后CSS,以及上下文。

主题的样式.css(之前(:

#sidebar { float: left; width: 250px; padding-left: 30px; padding-top: 10px; }
#sidebar .widget { margin-bottom: 30px; float: left; }
.widget ul { padding-left: 13px;}
.widget ul li { padding: 3px 0 3px 5px; list-style-image: url(images/bullet.png); }
.widget ul li a { color: #525252; }
.widget ul li a:hover { color: #000; }
.widget h3 { font-size: 24px; color: #000; display: block; background: url(images/widget-line.png) no-repeat bottom left; padding-bottom: 10px; margin-bottom: 10px; }
#search-bar { float: left; }
#search-bar #searchinput {background: url(images/search-bg.png) no-repeat; width: 175px; height: 35px; border: none; float: left; padding-left: 10px; padding-right: 10px; }
#posts { float: left; width: 640px; padding-right: 40px; }
#posts_full { width: 960px; }
#posts_full .post_full { width: 960px; }
#posts .post { float: left; margin-bottom: 40px; }
.post .text { float: left; width: 426px;}
#posts .post .no_thumb { width: 640px; }

最后一行(样式.css文件中的第 148 行(是必须更改的内容:

#posts .post .no_thumb { width: 640px; }

后:

#posts .post .no_thumb { width: 100%; }

在样式的第 148 行.css更改以下内容:

#posts .post .no_thumb {
width: 640px;
}

到:

#posts .post .no_thumb {
width: 100%;
}

最新更新