2 Replies - 221 Views - Last Post: 13 December 2017 - 11:20 AM

#1 wtp   User is offline

  • D.I.C Regular

Reputation: 28
  • View blog
  • Posts: 334
  • Joined: 08-December 11

Simple html/css makes no sense.

Posted 13 December 2017 - 02:45 AM

So I got the these very simple html and css page. The background of this page is white:
<!DOCTYPE html>
<html>
<head>
<link rel="stylesheet" type="text/css" href="css/main.css" />
</head>

<body>
</body>
</html>

<style type="text/css">
body {background: blue;}
</style>


The backgound of this page is blue:
<!DOCTYPE html>
<html>
<head>
<link rel="stylesheet" type="text/css" href="css/main.css" />
</head>

<body>
</body>
</html>


<style type="text/css">
body {background: blue;}
body {background: blue;}
</style>


Notice the only difference is a duplicate body style. So why does "body {background: blue;}" produce a white background and "body {background: blue;} body {background: blue;}" produce a blue one. What sorcery is this? I tried it more than a dozen times and the results are consistent. I was trying to make a jfiddle but making them public is broken now.

This post has been edited by wtp: 13 December 2017 - 02:48 AM


Is This A Good Question/Topic? 0
  • +

Replies To: Simple html/css makes no sense.

#2 andrewsw   User is online

  • Bouncy!
  • member icon

Reputation: 6563
  • View blog
  • Posts: 26,619
  • Joined: 12-December 12

Re: Simple html/css makes no sense.

Posted 13 December 2017 - 03:20 AM

<style type="text/css">
body {background: blue;}
</style>

Is this the content of your CSS file, main.css? If so then it is incorrect, it should not include the style tags, and should just be:

body {background: blue;}

The reason it might work with the rule duplicated is that the browser will skip past an error(s) and continue to try and parse the file.
Was This Post Helpful? 2
  • +
  • -

#3 wtp   User is offline

  • D.I.C Regular

Reputation: 28
  • View blog
  • Posts: 334
  • Joined: 08-December 11

Re: Simple html/css makes no sense.

Posted 13 December 2017 - 11:20 AM

Thank you
Was This Post Helpful? 0
  • +
  • -

Page 1 of 1