underline
phone number

A creative, friendly web design company based in Chelmsford, Essex

back light

Fizz Blog

Fixed CSS Background Image on iPad Not Working?

If you’ve been relaxing, thinking your pretty solid CSS code for adding a fixed (or not fixed) background image to your website pages was foolproof, then it’s time to think again. The mobile smartphone revolution is one thing, but tablets and iPads just might be an additional issue…

Ok, I admit it – I got lazy and didn’t check one site with a fixed background image on my iPad; after all, it’s Internet Explorer that causes us designers all the problems right? Not necessarily so these days. But there is a fix for the CSS code for your fixed background image not working.

css fixed background image ipad

Read the rest of this entry »

Share this..
Tweet about this on TwitterShare on FacebookShare on Google+Share on LinkedInPin on PinterestEmail this to someoneShare on TumblrShare on StumbleUponShare on Reddit

Tags: , , , , , , ,

Responsive Web Design: Equally Spaced Horizontal Menu

A menu is one of the first and most basic things your site needs. Styling a menu to fit a static web page that is say, 960px wide is one thing, but how do you create a horizontal menu that stretches across the width of the site in a responsive design?

We’ve already showed you how to create equally spaced divs in a responsive web design, so it might be a good idea to familiarise yourself with that first.

equally spaced horizontal menu with css

Read the rest of this entry »

Share this..
Tweet about this on TwitterShare on FacebookShare on Google+Share on LinkedInPin on PinterestEmail this to someoneShare on TumblrShare on StumbleUponShare on Reddit

Tags: , , , , , , , ,

Should Designers Now Make Responsive Websites as Standard?

When I first started making websites, we were basically just evolving from adding style code to the HTML file rather than adding it neatly to a separate CSS file and linking to it. As soon as we managed to put that one to bed, the looming horror of multi-sized screens became a reality (or nightmare if you prefer!) leaving us with more work to do to get the same end result – a website that works well.

responsive web design

Read the rest of this entry »

Share this..
Tweet about this on TwitterShare on FacebookShare on Google+Share on LinkedInPin on PinterestEmail this to someoneShare on TumblrShare on StumbleUponShare on Reddit

Tags: , , , , ,

Make CSS Background Image Fit Dimensions of Div

Using in-line styling, you can adjust the size of an image in your HTML code; but it often poses a problem for coders when they require a background image to be resized to fit the constraints of an existing div.

Why would you want to do this, you may ask? Well one example of usage would be when using an image as a send button perhaps or more likely these days – when using responsive design where your div will respond to the size of the user’s browser (desktop, iPhone, Android, Tablet, iPad etc etc).

make background image fit div with css

Read the rest of this entry »

Share this..
Tweet about this on TwitterShare on FacebookShare on Google+Share on LinkedInPin on PinterestEmail this to someoneShare on TumblrShare on StumbleUponShare on Reddit

Tags: , , , , , , , ,

Equally Spaced Divs in Your Web Design

There are several simple ways of making sure your divs are separated and spaced equally horizontally across a page. If you use a static 960px width, then you can dimly float your (set width, say 450px) left or even left and right and add padding and margins to fine tune.

But what if you have a fully fluid web design or a semi-fluid (this site uses a maximum width of 1200px and a minimum of 960px depending on browser) or maybe simply more than 2 or 3 divs that you want to show next to each other like this?

equally spaced divs css html

Read the rest of this entry »

Share this..
Tweet about this on TwitterShare on FacebookShare on Google+Share on LinkedInPin on PinterestEmail this to someoneShare on TumblrShare on StumbleUponShare on Reddit

Tags: , , , , , , , , , ,