Wednesday, July 31, 2019

font awesome

bọn chó fontawesome bây giờ nó chỉ cho mình 1 đường link sử dụng free, muốn nhiều link để có icon xịn thì phải bỏ tiền mua pro
cách đối phó:
sử dụng font awesome cdn

vài cdn có tiếng
https://stackpath.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css

Monday, July 29, 2019

How do you stretch an image to fill a div while keeping the image's aspect-ratio?

Update 2016:
Modern browser behave much better. All you should need to do is to set the image width to 100% (demo)
.container img {
   width: 100%;
}

Since you don't know the aspect ratio, you'll have to use some scripting. Here is how I would do it with jQuery (demo):
CSS
.container {
    width: 40%;
    height: 40%;
    background: #444;
    margin: 0 auto;
}
.container img.wide {
    max-width: 100%;
    max-height: 100%;
    height: auto;
}
.container img.tall {
    max-height: 100%;
    max-width: 100%;
    width: auto;
}​
HTML
<div class="container">
 <img src="http://i48.tinypic.com/wrltuc.jpg" />
</div>
<br />
<br />
<div class="container">
 <img src="http://i47.tinypic.com/i1bek8.jpg" />
</div>
Script
$(window).load(function(){
 $('.container').find('img').each(function(){
  var imgClass = (this.width/this.height > 1) ? 'wide' : 'tall';
  $(this).addClass(imgClass);
 })
})