html - CSS positioning images in the correct place -
i have following html:
#cake1 { float: left; } #cake2 { width: 200px; height: 200px; }
<img id="cake1" src="https://www.bbcgoodfood.com/sites/default/files/styles/category_retina/public/recipe-collections/collection-image/2013/05/rosewater-raspberry-sponge-cake.jpg?itok=ovpusqm9" /> <h2>cake</h2> <img id="cake2" src="https://www.bbcgoodfood.com/sites/default/files/styles/category_retina/public/chocolate-avocado-cake.jpg?itok=e2ewe_dx" />
i trying cake2 appear under cake1 using css, instead of displaying on right of image.
i removed float:left
;
<html> <head> <style> #cake2{ width: 200px; height: 200px; } </style> </head> <body> <img id="cake1" src="https://www.bbcgoodfood.com/sites/default/files/styles/category_retina/public/recipe-collections/collection-image/2013/05/rosewater-raspberry-sponge-cake.jpg?itok=ovpusqm9" /> <h2>cake</h2> <img id="cake2" src="https://www.bbcgoodfood.com/sites/default/files/styles/category_retina/public/chocolate-avocado-cake.jpg?itok=e2ewe_dx" /> </body> </html>
Comments
Post a Comment