Closed

Square Thumbnails via CSS *ONLY* - no access to HTML strcuture

This project received 10 bids from talented freelancers with an average bid price of $71 USD.

Get free quotes for a project like this
Employer working
Skills Required
Project Budget
N/A
Total Bids
10
Project Description

I'm trying to edit an image gallery and - whilst I have access to a 'custom' css template, I have no access to the HTML itself, nor how the images are placed within it. In turn, I can't introduce any divs, so the 'clipping' property I'd read about doesn't seem to be functioning as it should.

Here's the HTML code for a single image:













And this is as close as I've been able to get the CSS:

.thumbnails li {
width: 88px;
height: 88px;
overflow: hidden;
margin: 4px;
padding: 3px; }

.printSample {
background:none;
border: 0px !important; }

Result: [url removed, login to view]

Even though the images (somewhat) are square (you can see a slight discrepancy in size between the first, second and third images [H V V]) they're displacing(?) the values on the opposite side - so if I add a border, it's omitted on the right side of a horizontal and on the bottom of a vertical.

What I'm after is a square thumbnail (without distorting the image), 1px margin around it, 1px solid border (ccc) around that (all sides) and then 4px between one thumbnail and the next.

Potential issues:

- the website has a 'no right click' thing which is a bit of bother and can't be disabled. Opera ignores it and Chrome has an extension to do the same.
- the website has EXISTING stylesheets that I don't have access to - only the ability to override those functions with [url removed, login to view]
- edits that I've made are at the very bottom, but I don't know if any of the other code is of relevance ..so I've left it in.

Just need this one thing amending for now - but most likely more down the road.

Looking to make some money?

  • Set your budget and the timeframe
  • Outline your proposal
  • Get paid for your work

Hire Freelancers who also bid on this project

    • Forbes
    • The New York Times
    • Time
    • Wall Street Journal
    • Times Online