HTML5 Video Gallery with jQuery, Adding the HTML markup

With our CSS rules in place, let’s come back to the index.html file and inside the body tag set a few returns and we want to add our outermost div container.

So let’s start a div tag. Let’s type class equals. I’m going to put two quotes. Inside the quotes to get Aptana’s Code Studio to come up, I’m going to hit Ctrl + Space bar. I’m going to come down and select video gallery container, end the tag, and Aptana Studio will end the div tag overall.

Let’s split this open. Let’s come in here and add an anchor tag, a, space, class equals two quotes, my cursor inside the quotes, Ctrl + Spacebar .Let’s add the video Link class to that anchor link. Let’s end the tag, which ends the anchor. Next, let’s add another div class= “clear both” and then end the tag.

So this clear both is going to make sure that all of the floating anchor links with the video class have actually forced the outermost container to stretch vertically to encompass all of the floating thumbnails. So let’s do a quick check and make sure everything is working.

Leave a Reply

Notify of