Archive for the ‘Uncategorized’ Category

Yorkshire Car Buyer website

Wednesday, September 7th, 2011

A new website for my client we buy cars any make has just gone live.

The site has been created to allow people living in or around yorkshire to sell there car or simply get a free valuation for their car with the minimum fuss. Vitamin K created the website and branding for the company who wanted a consumer-friendly iamge for their car buying business. The website was designed to be simple with thr minimum number of required steps for getting the car owner to submit details about their vehicle prior to the sale.

Check out the website for we buy cars any make at www.we buy any car in yorkshire

Recommended Electrician in Wakefield

Friday, November 20th, 2009

As someone who is constantly trying to build a pool of reliable tradesmen that I can call on when a job falls outside my skillset, After recently having a new fusebox and consumer box wired in, I’m happy to recommend the following wakefield based electrician.

Might be useful to someone, and no… I didn’t design the site.

Equidistant objects with css - another way

Tuesday, October 21st, 2008

I recently read an article about the equidistant spacing of elements with css over at The simplicity of the technique really struck me as a case of good old lateral thinking. Despite this I was a little uncomfortable with the extra html that was required to make the technique work.

Inspired by the solution I decided to try and solve the same problem with out the need for the extra div’s.

Admittedly, the solution I came up with isn’t quite as clean as the one proposed by Chris Coyier but never the less I feel compelled to share it.

Here’s an example

It’s all about lists

firstly, here’s the basic html…

<ul class="equal">
<li class="n1" ><a href="thelink">the first item</a></li>
<li class="n2" ><a href="thelink">Another item </a></li>
<li class="n3" ><a href="thelink">A piece of link text </a></li>
<li class="n4" ><a href="thelink">this also goes somewhere </a></li>

That’s right, just good old lists with classes to allow us the differentiate between them.

The css

Firstly, all the list items need to be floated, The floats need to be contained within their parent ul and for simplicity I’ve added a rough and ready css-reset to remove any margins and padding and to remove the default bullets

ul.equal {
zoom:1;/* just for ie - put it in ie only style sheet*/
* { margin: 0px;
padding: 0px;
list-style: none outside;
.equal li {

The trick, as with Chris Coyier’s solution, the trick is to get three of the four items to each take up a third of the overall width. the trick with this technique is to offset the 1st item using a negative margin and use a padding on the containing ul to prevent anything from droping behind it. You’re now left with a ul which has a width which can be divided into thirds.

.n1{margin-left:-9em;display:inline;/*fix ie6 double margin float bug*/}
.n2,.n3,.n4{width:33.3%!important;text-align:right;width:33.2%;}/*ie6 causes problems due to rounding-up so use a slightly smaller percentage for it.

after the we’ve got the floated <li>’s nicely expanding we need to make sure the last three are right-aligned in their respected <li>

.equal a {
background: #fff;
height: 9em;
margin:0 0 0 auto;/*right aligns a block element in the good browsers*/
width: 9em;
text-align:center;/*to override the text-align required for ie6 for the parent li*/
.equal .n1 a {margin:0;}

In the good browsers you can use a min-width to prevent the boxes dropping down onto multiple lines.

As with most layout techniques… IE 6 has to be coaxed into behaving how would like. The code required to do this would normally be put in a stylesheet of it’s own using conditional comments but for the purposes of simplicity i’ve used a couple of hacks to keep everything in one file.

Hello world!

Tuesday, September 26th, 2006

Welcome to WordPress. This is your first post. Edit or delete it, then start blogging!

  • You are currently browsing the archives for the Uncategorized category.

  • Categories