Taimoor Taimoor - 1 year ago 82
CSS Question

Can't figure the reason of increased page width

My webpage http://www.pointmovies.com/ is showing scroll bar at the bottom and it looks like it has so much empty space on the right side. I can't figure out what is increasing the width of my page and how can I remove this.

It is wordpress, every post is an article (image) having width of 18% and float left, so on one row 5 posts/articles will display. But because of this 18% width I see that my page width increased. When I remove this 18% from the article css, page go to normal.

This is the css for article

width: 18%;
float: left;
margin: 0px 0px 0px 21px;
min-height: 400px;

Here is the screenshot. Please check the below scroll bar which should not be there.
enter image description here

Answer Source


#main {
overflow-x: hidden;

to your css.

For your other issue. The Style for the first div after #main should looks like this. That is why your site is not going responsive properly.

margin: auto;
width: 100%;
max-width: 1170px;
display: inline;

Tamoor, the overflow-X disables it from left to right.

enter image description here

enter image description here enter image description here

Recommended from our users: Dynamic Network Monitoring from WhatsUp Gold from IPSwitch. Free Download