.

Can we request the Custom CSS to be just insert the code of,
Copyright © 2014 Child’s Place LLP All Rights Reserved.

That’s not possible with CSS. We need to use PHP for that. Please put this into the bottom of your functions.php of your child theme:

<?php

// Remove default footer text
add_action( 'init', 'remove_fn_init' );
function remove_fn_init() {
     remove_action( 'attitude_footer', 'attitude_footer_info', 30 );
}

// Add custom copyright text
add_action( 'attitude_footer', 'attitude_footer_custom', 30 );

function attitude_footer_custom() {
     $output = '<div class="copyright">'.'Copyright © [the-year] [site-link] All Rights Reserved. '.'</div><!-- .copyright -->';
     echo do_shortcode( $output );
}

?>

The reason I need to wrap the remove_action around an ‘init’ hook is to ensure that it doesn’t fire before the original function is actually added to the hook.

Will it affect WordPress Attitude Theme after updated?

The codes for the footer is in footer-extensions.php; you can find it in
/wp-content/themes/attitude/library/structure/footer-extensions.php.

If you apply the child theme properly, it should work after updates . .. until the author decide to change something about it. (For example, one day the theme author could decide to change the $priority just for the fun of it.)

In which case you would need to take a look at the footer-extensions.php file of the parent theme and see what has changed. The base code is already there; adapting to minor changes like tag, name, or priority is a simple 30-second deal. I wouldn’t worry too much.

If the problem is solved, then could you please mark this as resolved? That would be much appreciated. Thank you.

You can control the footer text color with this:

#site-generator .copyright {
     color: #7a7a7a;  /* footer text color */
}

#site-generator .copyright a {
     color: #181818; /* footer link color *?
}

——-

As for the method, the best would be using a child theme. Instruction here: http://codex.wordpress.org/Child_Themes

If you’re unable to setup a child theme for whatever reason, then the Attitude theme also have a built-in custom CSS box in Appearance –> Theme Options –> Design tab –> Custom CSS. You can put your custom CSS there.

Alternatively, you can also use Jetpack (an official plugin from WordPress developers themselves) or Simple Custom CSS to accomplish the same thing.

Try this:

@media (max-width: 899px) {
	.sidebar-primary-container {
		display:none;
	}
}

You can see the information about the theme and its author in the theme’s style.css file: http://www.associatedforklifts.com.au/wp/wp-content/themes/eleven/style.css

You’ll find this:

/*
Theme Name: Associated Forklifts
Theme URI: http://www.elevenmedia.com.au
Description: WordPress theme
Author: Eleven Media
Author URI: http://www.elevenmedia.com.au
Version: 2013
*/

It appears the theme is custom-built by Eleven Media, a web development agency based in Australia.

——

It’s not that complex either. If you have a few hundred dollars on hand, any professional WordPress developer will be able to give you a similar theme–even better, actually.

I’m not sure what you’re talking about. This is what I see [link].

Could you please give a screenshot showing the black border in question??

IE8 and below doesn’t support @media queries. However, it should work with IE9 and above.

Microsoft itself has stop supporting Windows XP and its software versions, including IE8, since April 8, 2014. We have no reason to support it; I’m sorry but you’re on your own on that one. If you fancy digging around, you can look into Respond.js or IE’s conditional commenting system.

Maybe it has something to do with the content in the (right) side-bar (The Bio with picture) or the content of the blog posts (video’s with a particular size and setting)?

Those were the among the first things I check. I’m positive that they aren’t the problem.

The only issue I see is that being an SEO marketeer, your use of <img> tags doesn’t follow standard SEO recommendation. But that has nothing to do with this problem.

Can you reproduce the problem on OP’s live site and if so, was there anything different you had to do to replicate it? I can’t replicate the issue at all.

3** conditions are needed to reproduce the problem on his live site:

• only happen in Google Chrome, (though admittedly I was lazy and only tested on IE, Firefox, and Chrome :P)
• only happen from 783px to 1284px screen width,
• .primary-navgiation has to be float:right AND .primary-navgiation a has to be white-space:nowrap. (must be both, just changing the float rule to float:none + text-align:right OR changing white-space:nowrap to white-space:normal would fix it)

**(And a fourth condition: must be his site)

The problem is that something is causing an overflow when all 3 of those contions are met. Hence the code I provided at the post above . . . it patches the problem by removing one of the 3 conditions required for it to occur.

I tried to compare his CSS with the original, even took a look at his child-theme CSS here. I didn’t find anything suspicious :/