News & Blog

The 100% Guaranteed Method To Get YouTube iFrame Embeds Playing in HD by Default

April 10th, 2015 - Posted by Steve Marks to (X)HTML / CSS, Javascript / jQuery, Web Development.
We were recently working on a site where we needed to display a full screen video embedded from YouTube using an iFrame. Now, normally when embedding a video on a site, we’d visit the video on YouTube, click ‘Share‘, and grab the embed code. That normally looks something ...

Firefox Not Displaying Placeholder or Text Entered into Textbox

April 3rd, 2015 - Posted by Steve Marks to (X)HTML / CSS, Software, Web Development.
We use HTML5 input placeholders on the majority of our forms that we add to sites these days. They act as either instructional text (e.g. ‘Enter Keyword Here…’), or even replace labels completely. Whilst building a site recently, we came to perform cross browser testing a...

Google Chrome Developer Tools Crashing on Particular Site

November 19th, 2014 - Posted by Steve Marks to (X)HTML / CSS, Software, Web Development.
TL;DR – The crashing was caused by invalid CSS. Run the CSS through a validator and fix any invalid CSS. Longer Answer – The ‘Inspect Element‘ feature within Google Chrome is constantly in use in our office. It’s difficult to imagine working on a site without ...

Why CSS Line-Height Might Refuse to go any Lower

October 3rd, 2014 - Posted by Steve Marks to (X)HTML / CSS, Web Development.
I had an issue recently whereby I was trying to set the CSS line-height property of some text but it just would not go lower than a certain amount, even when setting it to, for example, 1 pixel. Making the line height larger however would increase the vertical space between the text. The c...

Remove Whitespace Between List Items Generated By wp_nav_menu()

September 26th, 2014 - Posted by Steve Marks to (X)HTML / CSS, PHP, Web Development.
Earlier today I was using wp_nav_menu() function within WordPress to output a navigation menu on a site. I was getting an issue however whereby the whitespace between the list items (<li>) was causing spaces between the menu items on the frontend. My list items had the ‘display...

Extract Header and Footer From Website HTML

June 11th, 2014 - Posted by Steve Marks to (X)HTML / CSS, Web Development.
A lot of projects we undertake begin with us copying an existing site’s HTML to use as the foundation for further updates. Whether it be implementing a site into a Content Management System, or maybe someone has lost contact with their existing developer and needs us to clone the sit...

How To Create a Torch Effect With jQuery

April 16th, 2014 - Posted by Steve Marks to (X)HTML / CSS, Javascript / jQuery, Web Development.
On the homepage of this site you’ll notice that there is a series of panels advertising each service. My favourite one is the ‘Contact Us‘ panel, mainly because of the effect being used. I call it the ‘Torch Effect‘ because it’s like someone shining a to...

Fixing Remote Modals in Bootstrap 3.1

January 31st, 2014 - Posted by Steve Marks to (X)HTML / CSS, Javascript / jQuery, Web Development.
Yesterday saw the release of Bootstrap version 3.1. After upgrading one of my sites that previously used version 3.0 I noticed that my remote modal dialog boxes had stopped working. The translucent backdrop would show but the content wouldn’t. There were no JavaScript errors, and no ...

Getting Marketo Landing Page JavaScript To Work

January 27th, 2014 - Posted by Steve Marks to (X)HTML / CSS, Javascript / jQuery, Web Development.
I was recently tasked with building some landing pages in Marketo for a client. They chose Marketo so that they could track conversions and record submissions from the embedded form. I’d built landing pages in the past with no real problems, that was until now. In summary, on my land...

Resolving Google Map Controls Appearing Squashed

January 9th, 2014 - Posted by Steve Marks to (X)HTML / CSS, Javascript / jQuery, Web Development.
After working on an implementation of a Google Map earlier today, I came across an issue with the controls of the map appearing squashed, almost invisible like so: As you can see, the zoom control for example is barely noticeable. It was the same for other controls on the map, and also the...