Solved

<STYLE> not working

Posted on 2006-10-27
6
247 Views
Last Modified: 2010-04-09
Based on what I'm reading in my HTML tutorial self-guide, I think the simple code below should run in my browser, but the <STYLE></STYLE> portion has no affect at all.  What am I doing wrong>>>

Code:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<HTML>
<HEAD>
<TITLE>Scripting Demo

<STYLE>
      <H3>{text-align: center}
      <P>{Color: #FF0000; font-style: Italic}
</STYLE>

</TITLE>
</HEAD>
<BODY>
<H3>This is a heading</H3>
<P>
This is a demo for using a style.
</P>

</BODY>
</HTML>
0
Comment
Question by:rlsokoloff
  • 4
6 Comments
 
LVL 54

Assisted Solution

by:b0lsc0tt
b0lsc0tt earned 63 total points
ID: 17822942
rlsokoloff,

Your style block needs to look like this instead.

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<HTML>
<HEAD>
<TITLE>Scripting Demo

<STYLE>
     H3 {text-align: center}
     P {Color: #FF0000; font-style: Italic}
</STYLE>

Let me know if you have any questions or need more information.

b0lsc0tt
0
 
LVL 54

Expert Comment

by:b0lsc0tt
ID: 17822962
I normally make it more readable by doing something like the example below.  Notice the element you identify in the style block is NOT in html tags (i.e. < or >).

h3 {
  text-align: center;
}

p {
  color: #ff0000;
  font-style: italic;
}
0
 
LVL 1

Accepted Solution

by:
cheetahshrk earned 62 total points
ID: 17822969
You wrote the css incorrectly, remove the < and > around the H3 and P in the style tags so it is
<STYLE>
     H3 {text-align: center}
     P {Color: #FF0000; font-style: Italic}
</STYLE>

Also, the </TITLE> needs to be moved to after the title and not after the style tag.
So it becomes <TITLE>Scripting Demo</TITLE>

In the end, your html file should look like this

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<HTML>
<HEAD>
<TITLE>Scripting Demo
</TITLE>

<STYLE>
     H3 {text-align: center}
     P {color: #FF0000; font-style: Italic}
</STYLE>

</HEAD>
<BODY>
<H3>This is a heading</H3>
<P>
This is a demo for using a style.
</P>

</BODY>
</HTML>
0
Windows Server 2016: All you need to know

Learn about Hyper-V features that increase functionality and usability of Microsoft Windows Server 2016. Also, throughout this eBook, you’ll find some basic PowerShell examples that will help you leverage the scripts in your environments!

 
LVL 54

Expert Comment

by:b0lsc0tt
ID: 17822981
Good catch on the title tag, Cheetahshrk.  I missed it.  Thanks!
0
 
LVL 54

Expert Comment

by:b0lsc0tt
ID: 17823222
I'm glad that I could be one of those that helped you.  Thank you for the grade, the points and the fun question.

bol
0
 

Author Comment

by:rlsokoloff
ID: 17835520
I made a comment when I awarded points, but I see it didn't get posted.  Anyway here's basicly what it was.

Thank you to both!  I caught the bracket problem when b0lscott posted, but cheetahshrk explicitly pointed out the issue minutes later.  Also, as a bonus b0lscott's formatting suggestion was very helpful, as well as pointing out to move the </TITLE>  tag (required to work)..

Thanks again!
0

Featured Post

Netscaler Common Configuration How To guides

If you use NetScaler you will want to see these guides. The NetScaler How To Guides show administrators how to get NetScaler up and configured by providing instructions for common scenarios and some not so common ones.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

Use these top 10 tips to master the art of email signature design. Create an email signature design that will easily wow recipients, promote your brand and highlight your professionalism.
This article demonstrates how to create a simple responsive confirmation dialog with Ok and Cancel buttons using HTML, CSS, jQuery and Promises
In this tutorial viewers will learn how to position overlapping items using z-index in CSS. They will also learn the restrictions on the z-index property.  Create a new HTML document with an internal stylesheet.: Create a div in CSS and name it Red.…
The viewer will learn the basics of jQuery, including how to invoke it on a web page. Reference your jQuery libraries: (CODE) Include your new external js/jQuery file: (CODE) Write your first lines of code to setup your site for jQuery.: (CODE)

810 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question