For some, placing you before and after pictures on your website is a simple task. But not for me.
It took me until this weekend to finally figure out the <div> tag. I assumed that by placing each of my photos in a <div> tag they would sort out side-by-side. I was wrong. After playing around with pages a bit, I figured out how to create both a row and column of pictures!
In order to create a row of photos like this:
Place all of your photos within one <div> tab like this:
<div> <center> <img src="Pictures/fork1.jpg" alt="Fork"width="188" height="188"><img src="Pictures/fork2.jpg" alt="Fork 2"width="188" height="188"> <img src="Pictures/forkchop.jpg" alt="Fork Chop"width="188" height="188"> <img src="Pictures/chop1.jpg" alt="Chop 1"width="188" height="188"> <img src="Pictures/chop2.jpg" alt="Chop 2"width="188" height="188"> </center> </div>
Now, if you want your photos to be side-by-side in a column like this:
things can get a bit more tricky…You must place both photos that you want side-by-side within the same <div> tag like this:
<div> <img src="Pictures/IMG_2871.JPG" alt="Mad Mex"width="304" height="228"> <img src="Pictures/madmex2.jpg" alt="Mad Mex 2"width="304" height="228"> </div>
Hopefully this was helpful for someone people as I’ve been struggling with this issue for a while now.
-Sarah Cinski
Source : digicompdiy[dot]wordpress[dot]com
0 comments:
Post a Comment