MicrostockGroup
Microstock Photography Forum - General => Symbiostock => Symbiostock - General => Topic started by: ShazamImages on August 12, 2013, 13:09
-
I have spent hours on this and can't find a solution.
If you take a look at my homepage (http://shazamimages.com/ (http://shazamimages.com/)), you will see that the thumbnails are currently aligned vertically towards the top. In other words, the top of each image is aligned along a line.
I would like to have the thumbnails on my home page align vertically towards the bottom. In other words, the bottom of each image should align along a line.
Is there any way to do this in CSS?
-
Yes, use Plrangs plug in so you get square thumbnails and they all align ?
-
Thanks.
Anyone know a solution without using a plugin? Via CSS?
-
Try adding this to your child theme CSS.
.attachment-post-thumbnail {
vertical-align: bottom;
}
-
Try adding this to your child theme CSS.
.attachment-post-thumbnail {
vertical-align: bottom;
}
Thanks, but that doesn't seem to work.
I also don't see that tag (.attachment-post-thumbnail) in the original CSS docs. Just wondering, where did you get this from?
-
Try this:
.widget-featured img { vertical-align: bottom;}
-
Try this:
.widget-featured img { vertical-align: bottom;}
Thanks, but that didn't work either.
Anyone else?
-
.symbiostock-latest, .symbiostock-featured { position:relative }
.inner-latest, .inner-featured { position:absolute;bottom:0;left:0;right:0;text-align:center }
try this
(updated the centering)
-
.symbiostock-latest, .symbiostock-featured { position:relative }
.inner-latest, .inner-featured { position:absolute;bottom:0;left:0;right:0;text-align:center }
try this
(updated the centering)
Yeah, let me know if that works. Up/down alignment is far trickier than left/right in CSS.
Its kind of funny, because HTML is actually just an XML document with its nails painted. Its amazing things have progressed as far as they have visually.
-
.symbiostock-latest, .symbiostock-featured { position:relative }
.inner-latest, .inner-featured { position:absolute;bottom:0;left:0;right:0;text-align:center }
try this
(updated the centering)
Thanks, that seems to have done it. It's weird though, because when I just copied it as is and pasted it, it didn't work at first. I then formatted it as follows and it started working:
.symbiostock-latest, .symbiostock-featured {
position:relative
}
.inner-latest, .inner-featured {
position:absolute;
bottom:0;
left:0;
right:0;
text-align:center
}