Solved

CSS problem at small widths

Posted on 2015-02-03
3
103 Views
Last Modified: 2015-02-03
When viewing http://dev4.wpmate.net/ when the browser width is 600px or less, the columns (sidebars and content) are stacking correctly, but the content section is still showing too far right. It should be the whole way to the left the same as the sidebars.

I added this to the media section of the stylesheet for 600px:
      .page-template-three-column-php #content, .page-template-three-column-php .left-sidebar, .page-template-three-column-php .right-sidebar {
      width: auto;
      float: none;
      clear: both;
      }      

Can anyone see what's still making the content area push to the right?
0
Comment
Question by:Dzynit
3 Comments
 
LVL 7

Accepted Solution

by:
rgranlund earned 500 total points
ID: 40586978
.page-template-three-column-php #primary
line 1777 I think.  You have wrong CSS .  no floats are noted and a big margin to the left.
0
 
LVL 53

Expert Comment

by:COBOLdinosaur
ID: 40586995
It looks like the problem is that the page is structurally unstable because of the duplicate id at lines 56 and 109.  Ids must be unique otherwise the CSS parser does not know what you are referencing (even if you use a class).  The HTML parser will generate code to prevent the browser from throwing an uncaught exception, but it does not attempt to decide which node to attach to the styles.

Cd&
0
 
LVL 14

Author Comment

by:Dzynit
ID: 40587015
That was it. Thanks much! A fresh pair of eyes always finds it :)
0

Featured Post

Master Your Team's Linux and Cloud Stack

Come see why top tech companies like Mailchimp and Media Temple use Linux Academy to build their employee training programs.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

Suggested Solutions

Title # Comments Views Activity
Custom Wordpress Loop 22 39
Change box shadow 1 29
Check ALL SP in database make sure there are no errors 17 45
Wordpress Only run code if on a certain page 11 23
Although it can be difficult to imagine, someday your child will have a career of his or her own. He or she will likely start a family, buy a home and start having their own children. So, while being a kid is still extremely important, it’s also …
An enjoyable and seamless user experience can go a long way on an eCommerce site. While a cohesive layout and engaging copy play roles in creating a positive user experience, some sites neglect aspects that seem marginal but in actuality prove very …
The viewer will learn how to create and use a small PHP class to apply a watermark to an image. This video shows the viewer the setup for the PHP watermark as well as important coding language. Continue to Part 2 to learn the core code used in creat…
Video by: Mark
This lesson goes over how to construct ordered and unordered lists and how to create hyperlinks.

830 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question