• Hi folks. I’ve been having a few “issues” with my site, such as being unable to change hyperlink colors despite using CSS that works for others, and having strange problems with sidebars being replaced with footer widgets when making changes to the Child Theme that otherwise work fine when made to the Parent theme (I know it’s a no-no to change the Parent, which is why I want to get whatever is wrong sorted out).

    I have tried installing fresh versions of Twenty Twelve, and have been through trouble-shooting steps suggested by people here and Codex. I am wondering if there might be some errors in my Stylesheet. I’ve been peering at it for days, but can’t locate anything. That doesn’t mean there are not errors staring me in the face that I’m not seeing.

    I wonder if someone would mind taking a look through my CSS and seeing if anything pops out as wrong, please?

    I’ve got this at the top (took name out for privacy reasons)

    /*
    Theme Name:     Twenty Twelve Child
    Theme URI:      http://example.com/
    Description:    Child theme for the Twenty Twelve theme
    Author:         XXXXYYYY
    Author URI:     http://perthpunk.com
    Template:       twentytwelve
    Version:        0.1.0
    */
    @import url("../twentytwelve/style.css");

    Then, the rest is as follows:

    /* Images */
    .alignleft {
    	float: left;
    }
    .alignright {
    	float: right;
    }
    .aligncenter {
    	display: block;
    	margin-left: auto;
    	margin-right: auto;
    }
    
    .site-info {
       display: none;
    }
    
    .site-content {
        margin: 1rem 0 0;
    }
    
    body .site {
    padding: 0 40px;
    padding: 0 2.857142857rem;
    margin-top: 0px;
    margin-top: 3.428571429rem;
    margin-bottom: 48px;
    margin-bottom: 3.428571429rem;
    box-shadow: 0 2px 6px rgba(100, 100, 100, 0.3);
    }
    
    #masthead .main-navigation ul.nav-menu,
    #masthead .main-navigation div.nav-menu > ul {
    	border-bottom: 0px;
    	border-top: 0px;
    }
    #masthead .main-navigation li ul li a {
    	background: lightgrey;
    }
    #masthead .main-navigation a {
    	color: darkblue;
    }
    #masthead .main-navigation li ul li a:hover {
    	background: #FF9933;
    }
    #masthead .main-navigation a:hover {
    	color: #660033;
    }
    #masthead .main-navigation ul.nav-menu,
    #masthead .main-navigation div.nav-menu > ul,
    #masthead .main-navigation li ul li a {
    	border-color: rgba(yellow, 0.1 );
    }
    
    @media screen and (min-width: 600px) {
     .site-content article {
      margin: 3em auto;
     }
    
    .site-header h1 {
       font-size: 2.85714rem;
    line-height: 1.84615;
    font-weight: bold;
       text-align: center;
    }
    
    .site-header h2 {
       font-size: 1.3rem  ;
       text-align: center;
    }
    
    .headerimg {width:960px; margin:0 auto;}
    }
    
    @media screen and (min-width: 600px) {
    .main-navigation ul.nav-menu,
        .main-navigation div.nav-menu > ul {
            display: inline-block !important;
            text-align: left;
    	margin-left: 40px;
            width: 100%;
        }
    
    .widget img {
        border-radius: 0;
        box-shadow: none;
    }
    
    .footlinks {
        text-align:center;
    }
    
    .entry-header .entry-title {
        text-align: center;
    }
    
    /* this removes the margin/space above the menu */
    .main-navigation {
    margin-top:0px;
    }
    
    body.page-id-85 {
     background: url("/wp-content/uploads/2013/05/HY-damned-look.gif") !important;
    }
    
    body.page-id-237 {
     background: url("/wp-content/uploads/2013/05/HY-damned-look.gif") !important;
    }
    
    body.page-id-215,body.page-id-234 {
     background: url("http://www.perthpunk.com/wp-content/uploads/2013/07/Orphans-background-550.jpg") !important;
    }
    
    body.page-id-631 {
     background: url("http://www.perthpunk.com/wp-content/uploads/2013/06/Lloyd-Memoirs-1650-3.jpg") !important;
    }
    
    body.page-id-318,body.page-id-401,body.page-id-1029,body.page-id-325,body.page-id-368,body.page-id-418,body.page-id-335,body.page-id-365,body.page-id-333,body.page-id-410,body.page-id-424,body.page-id-361 {
     background: url("http://www.perthpunk.com/wp-content/uploads/2013/06/Personal-Perspectives-backg.jpg") !important;
    }
    
    .page .site-title,
    .page .site-description {
     display: none;
    }
    
    /* Assuming this is your home page */
    .home .site-title,
    .home .site-description {
     display: block;
    }
    
    .entry-title
     {
      display: none;
    }
    
    .page .header-image {
     display: none;
    }
    
    .home .header-image {
     display: block;
    }
    
    .wp-caption .wp-caption-text,
    .gallery-caption,
    .entry-caption {
    	text-align: center;
    }
    
    .site-header {
    padding-bottom: 0rem;
    }
    
    .header-image {
        display: block;
     margin: 2rem auto 2em;
    }
    
    .nav-menu li > a:after {
        color: #888;
        content: ' ▾';
    }
    
    .nav-menu li > a:hover:after {
        color: #444;
        content: ' ▾';
    }
    
    .nav-menu li > a:only-child:after {
        content: '';
    }
    
    .box {
       float: none;
       width: 90%;
       padding: 15px;
       margin: 10px auto;
       min-width: 200px;
       border: 3px solid black;
    }
    
    .boxlloyd {
       float: none;
       width: 90%;
       padding: 15px;
       margin: 10px auto;
       min-width: 200px;
       border: 3px solid black;
       background-color:#9f9;
    }
    
    .boxletter {
       float: none;
       width: 90%;
       padding: 15px;
       margin: 10px 10px 3.42858rem;
       min-width: 200px;
       background-color: #EEE8AA;
       border: 3px solid black;
    }
    
    @media screen and (min-width: 978px) {
    .parawrapnot {
    clear:both;
    margin-bottom: 1.71429rem;
    }
    
    }
    }
    
    .ednotes {
        color: #0000FF;
        font-size: 0.8rem;
        line-height: 1.1rem;
        text-align: justify;
        position: relative;
        left: 16px;
        margin-top: -1.75rem;
        margin-right: 32px;
        margin-bottom: 1.71429rem;
    }
    
    .ednoteslist {
        color: #0000FF;
        font-size: 0.8rem;
        line-height: 1.1rem;
        text-align: justify;
        position: relative;
        left: 50px;
        margin-right: 100px;
        margin-bottom: 1.71429rem;
    }
    
    .edcomments {
        color: #0000FF;
        font-size: 0.9rem;
        line-height: 1.2rem;
        text-align: justify;
        position: relative;
        left: 50px;
        margin-top: -0.75rem;
        margin-right: 100px;
        margin-bottom: 1.71429rem;
    }
    
    .quotes {
      font-size: .9rem;
      line-height: 1.1rem;
      text-align: justify;
      position: relative;
      left: 16px;
      margin-right: 32px;
      margin-bottom: 1.71429rem;
    }
    
    .quotes2 {
      color: #FF0000;
      font-size: .9rem;
      line-height: 1.2rem;
      text-align: justify;
      position: relative;
      left: 40px;
      margin-right: 80px;
      margin-bottom: 1.71429rem;
    }
    
    .quotes3 {
      color: #FF0000;
      font-size: .9rem;
      line-height: 1.2rem;
      text-align: justify;
      position: relative;
      left: 40px;
      margin-right: 80px;
      margin-bottom: 3.4rem;
    }
    
    .entry-content img, .comment-content img, .widget img, img.header-image, .author-avatar img, img.wp-post-image {
        border-radius: none !important;
        box-shadow: none !important;
    }

    Not expecting a detailed analysis – just thought more tech-savvy folk might notice any obvious errors immediately.

    Cheers
    Ross

Viewing 6 replies - 46 through 51 (of 51 total)
  • Thread Starter RossB

    (@rossb)

    G’day Michael.

    YOU’VE PINGED IT! Before, I just copied the front-page.php file over from parent to child. I didn’t make a sub-directory entitled page-templates! I have now, though – and everything works as it should!

    Sorry you went through all that coding to create an alternative solution for me. If it’s any consolation, you’ve taught me a lot on the way, and I’m very appreciative of that.

    Just one last thing – a small styling issue. How do I now centre the ‘Download Geeks Album’ and ‘Download Orphans Album’ text over the Bandcamp player widgets, please (as you did with the players when they were under your ‘Custom Footer Widget 1’)?

    I have your code, but don’t know how to identify the widgets for CSS purposes now that they’re under the First Front Page widgets area.

    What a fantastic help you’ve been.

    Cheers!
    Ross

    Excellent Ross! It is usually the simplest solutions that work the best! I am confused though . . . when I look at your website now the widgets are on the right-hand side in a sidebar as opposed to in the footer. Is that where you wanted them? Just let me know for sure and I will tell you what to target to center the titles.

    Cheers!

    Michael

    Thread Starter RossB

    (@rossb)

    That’s strange, Michael. When I look at the site here (I’ve checked in FF, IE and Chrome), the widgets are positioned in the footers of the Front Page template pages, as intended.

    What on earth could account for your seeing different placement from me? Arrrggghh!

    Cheers
    Ross

    Hey Ross,

    Actually in looking at your site again I think the problem is a simple miscommunication . . . I see that other pages on your site have the footers at the bottom, just not necessarily the front page which is where I was looking initially because we were talking about the front-page.php template file.

    So the code to center the headers is as follows:

    .first.front-widgets .widget_text h3 {
    text-align: center;
    }

    But then it looks like the two footers are different sizes. To fix that you can try the following CSS code:

    .template-front-page .widget-area .widget, .template-front-page .widget-area .widget:nth-child(even) {
    width:45%!important;
    }
    
    .first.front-widgets .textwidget {
    margin-left: 10%;
    }

    I think that should do what you want it to do. Let me know if that does the trick!

    Cheers!

    Michael

    Thread Starter RossB

    (@rossb)

    Fabbo, Michael!

    I’ve been through all pages of the site, and everything checks out AOK. Realised on the way through that the different backgrounds of specific pages were not displaying, went through the stylesheet and noticed the appropriate code had somehow been corrupted, fixed it up, and voila – site now officially complete!

    Looking back through this now epic thread, you’ve not only provided a solution for every issue I had, but have also educated me on stylesheet layout, and a whole lotta other things. I probably sound like I’m gushing with extravagant praise and politeness, but sincerely, Michael, you’ve been a godsend. I just cannot thank you enough.

    All the very best to you. If we weren’t living in a virtual world, I’d buy you something decent to charge your glass up with.

    Cheers!
    Ross

    Awesome Ross!!! I am really glad we were able to get this sorted out for you. Believe me when I say that your thanks is more than enough reward. I believe that WordPress is a phenomenal web design platform, and I am happy to help people understand better how to use it. The fact that you learned some things along the way to make future projects a little easier is icing on the cake! A virtual toast between us then, but drink responsibly 😉

    I check these forums as often as possible, but if you have any future issues feel free to contact me directly via my website to let me know that you have posted a new topic and I will be happy to jump on and help in any way that I can.

    Cheers!!!

    Michael

Viewing 6 replies - 46 through 51 (of 51 total)
  • The topic ‘Are there any obvious errors in my stylesheet?’ is closed to new replies.