Dragon Posted September 21, 2017 Report Share Posted September 21, 2017 ok time for some guru's to help an old fart out. I'm trying to code a personal page in html 5 and css3. It's just a little personal web gallery for my personal server so it won't see the WWW. I'm running into a little problem tho. I have my images showing with no problems, my problem lies in positioning them. I want a clean css3 layout using html 5 for this design. my screen has all the images in a row, 5 total, but I want them to be laid out in the classic 5 look. four corners and one in the center. here is my css body { background-color: #297FC1; } IMG.displayed { display: block; margin-left: auto; margin-right: auto; padding-bottom: 50px; } IMG.right { border: 3px solid #000000; width: 300px; height: 500px; box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19); border-radius: 25px; float: right; position: relative; } IMG.center { border: 3px solid #000000; display: block; margin: auto; position: relative; top: 0; bottom: 0; left: 0; right: 0; width: 500px; height: 300px; box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19); border-radius: 25px; float: none; } IMG.left{ border: 3px solid #000000; width: 300px; height: 500px; box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19); border-radius: 25px; float: left; position: relative; } footer { font-size: 4px; font-style: normal; padding-bottom: 10px; position: fixed; } here is my html <!DOCTYPE html> <html> <head> <title>Start Page</title> <link rel="stylesheet" href="free.css"> </head> <body> <IMG class="displayed" src="/pics/header.png" alt="The Freeman's"> <article> <IMG class="left" src="/pics/vows.jpg" alt="taking the vows of matrimony"> <IMG class="right" src="/pics/rings.jpg" alt="placing rings on fingers"> <IMG class="center" src="/pics/ednkids.jpg" alt="Ed with the Kids"> <IMG class="left" src="/pics/husband&wife.jpg" alt="Kissing the bride"> <IMG class="right" src="/pics/bride&groomafter.jpg" alt="Mr. and Mrs. Freeman"> </article> </body> </html> any and all help needed. TIA Dragon Quote Link to post Share on other sites
Rosalind Nolau Posted October 14, 2022 Report Share Posted October 14, 2022 Website Design is a very important part of the business world. It is used to reach out to people and sell products or services. Some of the best websites are designed by experts. Explore thisĀ useful source site for hiring best designers. They can make your website look amazing and attractive for customers. I have seen many websites which are designed well by professionals and they have really good features. Quote Link to post Share on other sites
Recommended Posts
Join the conversation
You can post now and register later. If you have an account, sign in now to post with your account.