vmars316 1 Report post Posted August 11 (edited) Hello & Thanks , I am having trouble giving a <div> a background color : <div class="Cell" style="width: 25%; border-style: solid; border-color: #FF0000; background-color: D3DDEB; display: inline-block; padding-left: 5px; padding-right: 5px; "> I am using this example: https://www.w3schools.com/htmL/tryit.asp?filename=tryhtml5_migrate_7 I am using inline style= , when I get proper results , then I will transpose code into css styles . <!DOCTYPE html> <html lang="en"> <head> <title>HTML5</title> <meta charset="utf-8"> <style> body { font-family: Verdana, sans-serif; font-size: 0.8em; } header, nav, section, article, footer, div.city { border: 1px solid grey; margin: 5px; padding: 8px; } nav ul { margin: 0; padding: 0; } nav ul li { display: inline; margin: 5px; } </style> </head> <body> <header> <h1>HTML5 Skeleton</h1> </header> <nav> <ul> <li>News</li> <li>Sports</li> <li>Weather</li> </ul> </nav> <article> <h2>Famous Cities</h2> <div class="London" style="background-color: #00FF00;"> <h2>London</h2> <p>London is the capital city of England. It is the most populous city in the United Kingdom, with a metropolitan area of over 13 million inhabitants.</p> </div> <div class="Paris" style="background-color: #FF0000;"> <h2>Paris</h2> <p>Paris is the capital and most populous city of France.</p> </div> <div class="Tokyo" style="background-color: #0000FF;"> <h2>Tokyo</h2> <p>Tokyo is the capital of Japan, the center of the Greater Tokyo Area, and the most populous metropolitan area in the world.</p> </div> </article> <footer> <p>© 2014 W3Schools. All rights reserved.</p> </footer> </body> </html> And here is my example code: <!DOCTYPE html> <html> <head> <title>DIVs Template WIP</title> <meta content="text/html; charset=ISO-8859-1" http-equiv="content-type"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>DivsOnlyTemplate</title> <!-- file:///C:/vmars.us/DivsOnly-STARTover.html https://www.dummies.com/web-design-development/css3/using-the-div-tag-to-create-tables/ https://htmlformatter.com/ https://www.w3schools.com/htmL/tryit.asp?filename=tryhtml5_migrate_7 --> <style type="text/css"> </style> </head> <body style="background-color: #FFFFFF;"> <br> <div class="Table" style="border-style: solid; text-align: center; border-color: #5A697D; border-width: 16px;"> <!-- ============NewRow============== --> <p></p> <div class="Row" style="border-style: solid solid solid solid; border-width: 4px; border-color: #000000;"> <div class="Cell" style="width: 25%; border-style: solid; border-color: #FF0000; background-color: D3DDEB; display: inline-block; padding-left: 5px; padding-right: 5px; "> <p style="border-style: solid; border-color: #0000FF; background-color: D3DDEB"> Row 1 Column 1 <br><img src="Empty.png" alt="Empty.png"></p> </div> <!-- <div class="Cell" --> <div class="Cell" style="width:70%; border-style: solid; border-color: #00FF00; background-color: 000000; display: inline-block; padding-left: 5px; padding-right: 5px; "> <p> Row 1 Column 2 <br><img src="Empty.png" alt="Empty.png"> </p> </div> <!-- <div class="Cell" --> </div> <!-- <div class="Row" --> </div> <!-- <div class="Table"> --> </body> </html> Please what am I doing wrong ? Thanks Edited August 11 by vmars316 Share this post Link to post Share on other sites
dsonesuk 840 Report post Posted August 12 What is missing from border colour used compared to the background colour used, non of the six alpha-numeric hex colour characters will not show any colour without it at the beginning. Share this post Link to post Share on other sites
vmars316 1 Report post Posted August 12 Ugh ! Thanks dsonesuk , Sorry , I missed that . Share this post Link to post Share on other sites
