Please help me figure out my HTML problems!

[intheflow]

My task is to edit this web page: http://discuss.iliff.edu/justiceandpeace/students.html

All I'm doing is adding another quote. Yet the second I add it, the page comes up in a larger Times New Roman font (I think it's the HTML the default font). I'd really like to keep the smaller, ariel-stlye font, but I can't find any reference in the source code as to font, except for a </font> tag.

There are some tags in this code that I'm not familiar with, but I still don't see how my adding anotehr paragraph would change the font.

Can anyone help me?

[veteran_for_peace]

1. Check out the style sheet

<link rel="stylesheet" href="JPstylesheet.css" />

that is probably where the style is being formatted. You would want to use the class="text" to use the style sheet for your quoute.

[intheflow]

3. I probably don't have access to that.

The school hired a consultant to do this page a gazillion years ago, but she quit in a huff and never left any notes for anyone.

Besides, what is a style sheet? If I get rid of the tag to that style sheet and replace it with a straight font tag, will that solve my problem?

[veteran_for_peace]

6. Stylesheet.

You probably do have access to it. It is located in the same directory as the html file that you are trying to edit. Here is the text from the file:

{margin: "0px";
top-margin: "0"}

{font-family: Verdana, Helvetica}

.list {font-family: verdana, Helvetica;
font-size: 10pt;
list-style-type: square}

.here {font-family: Verdana, Helvetica;
font-size: 10pt;
font-weight: bold;
color: #ffffff;
list-style-type: square}

.group {font-family: Verdana, Helvetica;
font-size: 10pt;
font-weight: bold}

.text {font-family: Verdana, Helvetica;
font-size: 10pt}

.small {font-family: verdana, Helvetica;
font-size: 8pt}

.line {font-family: Times New Roman;
font-size: 10pt;
color: #ffffff}

.indent{font-family: verdana, Helvetica;
font-size: 10pt;
text-indent: 6px}



a {text-decoration: none}
a:link {color: #5500FF}
a:active {color: #5500FF}
a:hover {color: #5500FF;
text-decoration: underline}
a:visited {color: 5500FF}

a.main {text-decoration: underline}
a:link.main {color: #5500FF}
a:active.main {color: #5500FF}
a:hover.main {color: #5500FF;
font-weight: normal}
a:visited.main {color: #5500FF}

There is a section in there called .text What this section of the style sheet does is it can be used to format all of your web pages. In the html it is reference by using the "<P class="text">" all that does is to tell the web browser to format the text within the <p> tag using the stylesheet class .text. You can change the font, size, color of the text.

[intheflow]

9. OK, while I don't know squat about style sheets,

I know enough about HTML to include the <P class="text"> tag when I inserted the new paragraph. But it still changed the font. :shrug:

[Stephanie]

2. style sheets? css

<p class="text">

[intheflow]

4. css?

What dat? ;(

[ps1074]

5. Here is your JPstylesheet.css

{margin: "0px";
top-margin: "0"}

{font-family: Verdana, Helvetica}

.list {font-family: verdana, Helvetica;
font-size: 10pt;
list-style-type: square}

.here {font-family: Verdana, Helvetica;
font-size: 10pt;
font-weight: bold;
color: #ffffff;
list-style-type: square}

.group {font-family: Verdana, Helvetica;
font-size: 10pt;
font-weight: bold}

.text {font-family: Verdana, Helvetica;
font-size: 10pt}

.small {font-family: verdana, Helvetica;
font-size: 8pt}

.line {font-family: Times New Roman;
font-size: 10pt;
color: #ffffff}

.indent{font-family: verdana, Helvetica;
font-size: 10pt;
text-indent: 6px}



a {text-decoration: none}
a:link {color: #5500FF}
a:active {color: #5500FF}
a:hover {color: #5500FF;
text-decoration: underline}
a:visited {color: 5500FF}

a.main {text-decoration: underline}
a:link.main {color: #5500FF}
a:active.main {color: #5500FF}
a:hover.main {color: #5500FF;
font-weight: normal}
a:visited.main {color: #5500FF}

[intheflow]

8. Wow! How'd you access that?

I never saw it in the code. :shrug:

[veteran_for_peace]

11. Click on there and you see it for yourself

http://discuss.iliff.edu/justiceandpeace/JPstylesheet.css

[ps1074]

12. it was easy

Just saw it in the source and then typed the URL :)

Now, try this:

<p class="text">YOUR TEXT HERE</p> - your text will appear as the text in student's testimonials.

[intheflow]

14. I did that.

I know enough about HTML to know that the quote I was inserting had to be bracketed by the "p" tags, as were all the other quotes. It still reverted to the default TNR font.

I feel very dumb. And you're being very patient with me--thank you!!

[veteran_for_peace]

7. Here is a great primer on CSS

http://www.w3schools.com/css/css_intro.asp

[Stephanie]

17. that's a great site, thanks!

never saw that before

[Xithras]

10. I teach web design, here are some simple explanations

CSS is basically code that defines what something is supposed to look like. A CSS style definition may have the font, the size, the color, whether or not it's underlined, or any of a dozen other options. In your case, theres a definition called "text" in your CSS file that sets the arial typeface and font size.

Now, you may be aware that the basic tag for text on a webpage is <P>, but the P tag doesn't actually affect the way the text is displayed. To make your text display using the definitions in the "text" CSS style, you'll have to edit the tag to read <p class="text">. That tells the browser that you're starting a new paragraph, and that you want it displayed using the "text" style.

What editor are you using? Most visual editors will allow you to set the style without actually entering the HTML code, but they all do it differently so I can't get more specific without knowing which tools you're utilizing.

[Xithras]

13. Oh, and we also have a web developers group here on DU.

If you run into any other problems:

http://www.democraticunderground.com/discuss/duboard.php?az=show_topics&forum=288

[intheflow]

15. I'm editing on notepad.

And it doesn't seem to matter if I put the "P class" tags in. It still comes up the default font when I add the new paragraph.

It seems like it would be so simple! I feel incredibly dumb! :argh:

[ps1074]

19. Must be something simple

There are way too many tables... Too many <td> and <tr> tags... I am almost lost. Don't like the coding at all :(

I found one line with improper nesting of elements... The 9th line from the bottom:

</tr></td></table>

Try changing it to:
</td></tr></table>

Such small mistakes can mess the whole document. Try fixing this one and see if it works.

[intheflow]

21. I corrected it to no avail. :-( But thanks anyway. n/t

[intheflow]

16. Could the problem be that

I'm just viewing the HTML changes locally on my computer? In other words, I haven't uploaded the file to the server, so my browser isn't connected to the css file. So I'm not seeing the proper text just like I'm not seeing the photos as I edit?

[Stephanie]

18. are you hitting "shift reload" after you make the changes?

you might just be looking at the cached page

[intheflow]

20. "Shift reload"?

I'm just hitting reload, per my Explorer tool bar. Is there a different keypad combo of "shift reload" that will somehow give me a newer version of my page?

[Stephanie]

22. hold down shift when you hit reload and it will clear the cache

but you might be right that it has to do with linking to the style sheet - you might need to upload the page to see it. now you're over my head though, so we'll have to ask someone else.

[intheflow]

23. Yeah, I tried the shift thing.

No good. I also can't upload the file. The school won't give me access to the server, I'm just editing off the web page and then the library secretary will load my edited file to the server.

Not that I'm bitter...

[Stephanie]

24. So you need the style sheet and you need to put the page and the sheet

in the same folder so they can link, then you shd be able to see it. I think. I may be wrong. We shd ask someone who knows.

[intheflow]

25. I've figured it out.

It's just a matter of how I initially save what I want to edit. I have to save the web page to my hard drive and then go to the "File Edit in Notepad" option. I had been editing in notepad on the live web page.

Although I'm still don't get why it would matter. Thanks for helping me out! :hi: