Center
This is one of the magical parts of DhoniShow. center preloads images and takes control of the dimensions of your gallery. There are just a few, but therefore very important options:
center-elements_true
This option is set true by default. It centers smaller images relatively to the larger images.
- Preview
-
- Source
-
<div class="dhonishow center-elements_true"> <img src="earo-lato.jpg" alt="Ear-O-tation Lato" /> <img src="benjamin.jpg" alt="Benjamin" /> <img src="pinks_not_red.jpg" alt="Pink's not red" /> <img src="pasta.jpg" alt="Pasta für Pawel" /> <img src="cordless.jpg" alt="Cordless" /> </div>
center-elements_false
Disables the centering of images and aligns images to the top and left or right side, depending on the text-align css property of the element.
- Preview
-
- Source
-
<div class="dhonishow center-elements_false"> <img src="benjamin.jpg" alt="Benjamin" /> <img src="earo-lato.jpg" alt="Ear-O-tation Lato" /> <img src="pinks_not_red.jpg" alt="Pink's not red" /> <img src="pasta.jpg" alt="Pasta für Pawel" /> <img src="cordless.jpg" alt="Cordless" /> </div>
center-width_*
If you would like to set the width of your gallery to a fixed value, just replace the asterisk with your desired pixel value. In the following example the gallery width is fixed to 300 pixels center-width_300.
- Preview
-
- Source
-
<div class="dhonishow center-width_300"> <img src="pinks_not_red.jpg" alt="Pink's not red" /> <img src="earo-lato.jpg" alt="Ear-O-tation Lato" /> <img src="benjamin.jpg" alt="Benjamin" /> <img src="pasta.jpg" alt="Pasta für Pawel" /> <img src="cordless.jpg" alt="Cordless" /> </div>
center-height_*
Exactly the same functionality as enter-width_*, only for height.
- Preview
-
- Source
-
<div class="dhonishow center-height_500"> <img src="pasta.jpg" alt="Pasta für Pawel" /> <img src="earo-lato.jpg" alt="Ear-O-tation Lato" /> <img src="benjamin.jpg" alt="Benjamin" /> <img src="pinks_not_red.jpg" alt="Pink's not red" /> <img src="cordless.jpg" alt="Cordless" /> </div>