Avoid Image width and height distraction with CSS.

Hi! Hope everyone is fine! Today i am going to share how to avoid image distraction with CSS.Have a look below code and it will do magic!

Here is your HTML code,
<a href="#" class="img-thumbnail">
<img src="image1.jpg"  />
</a>

Here is you CSS code,
.img-thumbnail{
    background: none repeat scroll 0 0 #111111;
    display: inline-block;
    height: 160px;
    overflow: hidden;
    width: 200px;
}
.img-thumbnail img {
    width: 100%;
}

Comments

Post a Comment

Popular posts from this blog

Ghostscript Installation and Configuration in Windows 7

Image
Ghostscript Introduction: Ghostscript is a library which is used to convert any file extension to any file extension. For eg, if you want to convert pdf to image or image to pdf we can convert easily using Ghostscript. And yes, you can also use Imagemagic to do the same task but, Compare to Imagemagic, Ghostscript executes fast and uses less file space. Below are the results for your reference, Using `convert` to convert from PDF to PNG, with 300 density: it took 426 seconds and 51mb Using `gs` to convert from PDF to PNG, with 300 density: it took 135 seconds and  39mb disk space Also I have achieved further time improvement by using jpeg, Using `gs` to convert from PDF to JPEG with 300 density and 100% quality: it took 32 seconds and 153mb disk space Ghostscript Installation: Download and install Ghostscript with the correct version and Operating system, http://www.ghostscript.com/download/gsdnld.html In my case, I have installed Ghostscript 9.1...
Read more

Joomla - Get user id

To get user id in joomla use, $user =& JFactory::getUser(); $userId = $user->get( 'id' ); You can also get User details like, $user =& JFactory::getUser(); $userId = $user->username;   // Returns username $userId = $user->name;         // Returns real name $userId = $user->id;             // Returns id
Read more