When I try to set the background color to something, it looks completely fine with Firefox. But on Chrome, it's doing something weird.
I set the body background color to blue and it looks the way I'd expect it to look when using Firefox. But Chrome seems to make the body color light-blue instead of blue and has a purple box around the sample jumbotron I created. At first I thought the container had some sort of weird background property that made it look that way but after setting the container's background-color to red, I saw that the purple box isn't even the container. I'm not quite sure what that purple box is. What is going on here?
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width= device-width, initial-scale = 1" /> <link rel="stylesheet" type="text/css" href=""> <title>Bootstrap</title> </head> <body style="background-color: #0000FF"> <div class="container" style="background-color: red;"> <div class="jumbotron"><h1>Jumbotron</h1></div> </div> </body> </html>
The first image is Chrome and the 2nd one is Firefox