From the course: HTML: Images and Figures

Unlock the full course today

Join today to access over 22,600 courses taught by industry experts or purchase this course individually.

Solution: Images and text

Solution: Images and text - HTML Tutorial

From the course: HTML: Images and Figures

Start my 1-month free trial

Solution: Images and text

“

- [Instructor] Here's my solution to your challenge. To save some time, I've already added the basic image elements with their source and alt attributes. The images I added were the German flag on line 17 and 18, the Munich flag on lines 23 and 24, the museum clock on lines 28 and 29, and the city view image on lines 35 and 36. Let's go to the browser to verify that the images display. Now that we know that, I can make them look more like I want them to. My first task is to center the heading in the internal stylesheet by adding text-align, center. I'll save that and reload it in the browser. The flags are way too large and the vertical alignment also needs centering. The flag dimension is 320 by 192, so I'll divide each of them by three. That'll make the width 107 and the height 64. I want to do this on only one flag first. That way, if it doesn't look right, I have only one change to make instead of two. So a save and a reload tells me that the size is right. Now, I add a style to…

Contents