Στοιχηση εικόνων και video και προσθήκη Caption

Εάν θέλουμε να στοιχίζουμε (Αριστερά-δεξιά-κέντρο) τις εικόνες μας ή τα video μας και να βάζουμε captions κάτω από αυτές τότε κάνουμε τα παρακάτω:

Πηγαίνουμε Πίνακας Ελέγχου--Σχεδίαση--Επεξεργασία HTML (Πατήστε Cntr F για να ανοίξει το ευρετήριο του κώδικα) και γράφουμε </b:skin>. Ακριβώς επάνω από το </b:skin> αντιγράφουμε  και επικολλούμε  τον παρακάτω CSS κώδικα με τα κόκκινα γράμματα. 

.left-caption { float: left; margin: 0 1.5em 1em 0; padding: 0.5em; text-align: center; } .right-caption { float: right; margin: 0 0 1em 1.5em; padding: 0.5em; text-align: center; } .center-caption { margin: 0 0 1em 0; padding: 0; text-align: center; } .left-caption img, .right-caption img, .center-caption img { margin: 0 auto; display: block; } .left-caption p, .right-caption p, .center-caption p { background: #eee; margin: 0; line-height: 1.6em; padding: 0.5em; border-bottom: 1px solid #ccc; border-top: 1px solid #ccc; font-size: 0.9em; color: #333; }  

π.χ Στοίχηση ενός video αριστερά
<pre class="code"><span class="left-caption"><iframe allowfullscreen="" frameborder="0" height="190" src="http://www.youtube.com/embed/cOVfzUH5-m0" title="YouTube video player" width="150"></iframe><p>Ο Τίτλος (Caption) εδώ!</p> </span></pre>
Με κίτρινο χρώμα ο κώδικας που δίνει το ενσωματωμένο video

π.χ Στοίχηση ενός video δεξιά
<pre class="code"><span class="right-caption"><iframe allowfullscreen="" frameborder="0" height="190" src="http://www.youtube.com/embed/cOVfzUH5-m0" title="YouTube video player" width="150"></iframe><p>Ο Τίτλος (Caption) εδώ!</p> </span></pre>
Με κίτρινο χρώμα ο κώδικας που δίνει το ενσωματωμένο video
Σημείωση : Παίξε με τα Left, center και right για την τοποθέτηση των video σε μια σειρά.