CSS clip and absolute positioning

I use the clip to create gallery thumbnails. Unfortunately, a clip can only be used when the element is absolutely positioned. Applied the same way for every img, this, of course, makes them sit on top of each other when using the same CSS style, something like this.

.Thumbnails {
    position: absolute;
    height: 105px;
    clip: rect(50px 218px 155px 82px);
}

How can I put them relative to each other? I just need some basic lines.

+5
source share
3 answers

I would not recommend a clean css solution. Have you considered a library like phpThumb ? From there you just use the following css:

.Thumbnails{float:left}

And the thumbnail links look like this:

<img src="path/to/phpThumb.php?src=image.jpg&h=100&w=100&zc=1" alt="some image" />

100x100, zc ( , .

+1

CSS, , - . CSS- , :" CSS- CSS. , , , , , , Internet Explorer, .

. : , , , , . , , width: and height: , , , :

.Thumbnails {
  width: 100px;
  height: 100px;
  padding-bottom: 10px;
  padding-right: 10px;
}

(Eric Meyer) “Cascading Style Sheets: The Ultimate Guide” says: “The long and confusing history of the clip means that it works inconsistently in modern browsers and cannot be used in any cross-browser environment.”)

0
source

All Articles