I want to display an image in 100x100 thumbnail which will be centered vertically and horizontally keeping the aspect ratio and it must be filled in 100x100 thumbnail div e.g. an image of 800x600 must be displayed vertically filled and horizontally overflowed from both sides. How can I do this with css ?
Asked
Active
Viewed 541 times
-2
-
We would like to help, but please do show us what you have tried — then we can help to improve on your implementation. Without code, our hands are tied. – Terry Nov 10 '13 at 15:33
-
I didn't tried anything yet – Ali Shahzad Nov 10 '13 at 15:34
-
We can't help until you have attempted at something - or anything. We avoid spoon-feeding users. – Terry Nov 10 '13 at 15:39
-
Similar question: ["How to automatically crop and centre an image](http://stackoverflow.com/questions/11552380/how-to-automatically-crop-and-center-an-image). See also the `background-size` CSS property. – Dre Nov 10 '13 at 18:51
1 Answers
0
If you have some painting programs like photoshop please make some photo and show as all how you wanna to do it. Maybe we will know how to help cuz know i don't get it what you want. If you only wanna align image on center on css use margin:50% 50%; It gives you X - center and Y - center + it depends if it's position:absolute; or relative... For example:
<div style="width:400px;hegiht:500px;">
<img src="bla.jpg" width="100px" height="100px" style="margin: 50% 50%;" /> // It only will be centered in this Div only!
</div>
user2976420
- 16
- 3