Reprint images of unknown size horizontal and vertical centering in a known size container (ii) _ Experience Exchange

This is an example of the horizontal and vertical centering of an unknown size picture in a container of known size, the original title: "Centering an image of unknown size in an outer container of known size", Author: Stu Nic Holls form:http://www.cssplay.co.uk/menu/centered.html , Publication date: 15th October 2006.

This article was published by Forestgan in 2006-10-17, more articles.

This horizontal and vertical center example works well in ie5.x, IE6, IE7, Firefox, Opera, Mozilla, Netscape, and has written two sets of simple styles for IE and non-IE respectively.

IE uses inline-blocks, non-IE uses Table-cell and vertical-align.

Css

/* For Non-ie browsers */div.holder {width:750px; height:300px; background: #f8f8f8; border:1px solid #777; Text-align:cen ter Display:table-cell; Vertical-align:middle;}}

 
  

Xhtml

The author's example is a single, I expanded the next, a page of 6 pictures, can be applied to such as album and product display places, presentation address.

