@schill You can also do it this way When you'll use pics and they all going to be same height and width you can remove that class .img-box from CSS and replace it in HTML with picture If they not going to be same height you will set the img-box to tallest pic Also if there's going to be more then one line of text you have to handle this accordingly with height of .box1 Edit: By the way. Remove that gray background, it was just for presentation to fake the pics.
Remember to set the height and width of image in HTML but don't use those values to scale the image Also you can remove width of class img-box or remove it completely if your pics are same height
@jurotek and @wolfcry911 Both of you, thanks so much for taking the time to teach me your examples. I saved them both for future references and I am very happy how mine looks on the website now.
I am looking to get some help on how to do a similar layout as the example below. I really like the layout of equipment. Thanks!
http://www.finning.ca/Products/Equipment/New_Equipment/Default.aspx
I would make it a simple unordered list. I'd make the list items a fixed width and height, float them left and text-align: center. Done.
You can also do it this way
When you'll use pics and they all going to be same height and width you can remove that class .img-box from CSS and replace it in HTML with picture
If they not going to be same height you will set the img-box to tallest pic
Also if there's going to be more then one line of text you have to handle this accordingly with height of .box1
Edit:
By the way. Remove that gray background, it was just for presentation to fake the pics.
Also you can remove width of class img-box or remove it completely if your pics are same height