?
Solved

<STYLE> not working

Posted on 2006-10-27
6
Medium Priority
?
265 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
[X]
Welcome to Experts Exchange

Add your voice to the tech community where 5M+ people just like you are talking about what matters.

  • Help others & share knowledge
  • Earn cash & points
  • Learn & ask questions
  • 4
6 Comments
 
LVL 54

Assisted Solution

by:b0lsc0tt
b0lsc0tt earned 252 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 248 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
WordPress Tutorial 4: Recommended Plugins

Now that you have WordPress installed, understand the interface, and know how to install new parts, let’s take a look at our recommended plugins.

 
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

Free Tool: Subnet Calculator

The subnet calculator helps you design networks by taking an IP address and network mask and returning information such as network, broadcast address, and host range.

One of a set of tools we're offering as a way of saying thank you for being a part of the community.

Question has a verified solution.

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

Have you tried to learn about Unicode, UTF-8, and multibyte text encoding and all the articles are just too "academic" or too technical? This article aims to make the whole topic easy for just about anyone to understand.
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 style a corner ribbon overlay for an image using CSS Create a new class by typing ".Ribbon":  Define the class' "display:" as "inline-block": Define its "position:" as "relative": Define its "overflow:" as …
The viewer will learn how to create a basic form using some HTML5 and PHP for later processing. Set up your basic HTML file. Open your form tag and set the method and action attributes.: (CODE) Set up your first few inputs one for the name and …
Suggested Courses

801 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