could someone re-create this in css for me? willing to pay :)

[joemorris86]

Hello,

I was wondering if someone could recreate this image for me?
I do not need the blue image or the number 2, just the item box itself with the writing.

image

I have tried myself but cannot accurately re create it.

I am willing to pay for your time, thanks.

[Paulie_D]

I am willing to pay for your time, thanks.

We’re not a code-writing forum (for pay or otherwise)…we’re a ‘help you with the hard bits forum.

By all means find and hire a local developer who can do this for you but, frankly, i don’t see what is very hard about it.

[joemorris86]

I’m quite new to css and cannot replicate it as neatly as the image, theres a lot more gaps and spaces when i try if that makes sense.

You probably do not see whats very hard about it because your an experienced css person :P

[cyberjo50]

do it in photoshop

[shaneisme]

Seems like an overly-complicated thing to do in CSS… I have good money an image would have less overhead. If you wanted to save a trip back and forth to the server, you could technically encode the image in base64 when you’re done.

Otherwise, I agree with @cyberjo50.

[Paul Sullivan]

http://jsfiddle.net/9GTLb/

Just something I did pretty quick, so it’s not perfect. I’d tweak it to your needs. (Specific font for example, or scaling to the size you need.) I’d use photoshop to put a grid in the background of the main box with an opacity set at something like 50-60%. You could also use an opacity filter in the CSS, but that will just limit you to Chrome.

I also fiddled (Hah. Fiddled. Cause… ya know… I used jsfiddle) with doing the yellow side bar with a border, but it wasn’t turning out right. Maybe you or someone here would have better luck with it, but it seems to function fine as is. :)

[janet4now]

I have a feeling you’re looking for an image file, not a css solution.

If you don’t have the layered file, this is kind of tricky.

Can you show your attempts at recreating?

[Author]

Posts