PDA

Click to See Complete Forum and Search --> : Css

Herrjosua
05-10-2005, 05:07 PM
I have an external style sheet formatting all my text on my webpage. But their is some text that I want to be slightly different. I know I need to do in an inline style sheet, but how would I go about it? Currently I am using this <p style="font-size:10px;text-decoration:none;font-style:italic;"> This code works on all but the text-decoration part, my text is still underline. How can I fix both of these problems?
Thanks
Josh
BonRouge
05-10-2005, 06:02 PM
I know I need to do in an inline style sheet, but how would I go about it?Not true. You should give that bit of text an id and then reference it in your style sheet.
Currently I am using this <p style="font-size:10px;text-decoration:none;font-style:italic;"> This code works on all but the text-decoration part, my text is still underline.Strange... What you've done should work. There must be more to this than meets the eye. You need to post a link to your page. Why is it underlined in the first place? Surely not all of your text is underlined (?!)
How can I fix both of these problems? Both? I counted one problem. Is the other one being transmitted subliminally?
Herrjosua
05-10-2005, 07:40 PM
I have posted the file online now. ops wrong file. lol They can be view here (http://www.howlingwolfstudios.net/html/help.htm)
BonRouge
05-10-2005, 07:45 PM
You said this was a CSS problem and you're linking to a Flash menu ?! :confused:
Sanim
05-10-2005, 07:53 PM
*cough* I think he's referring to the link that links to the Flash file..
Using the source of the page that you displayed, here's the code:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>More Help</title>
<style type="text/css">
<!--
body,td,th {
color: #FF0000;
}
body {
background-color: #000000;
}
a,a:visited {
color: #FFFFFF;
text-decoration: none;
}
a:hover {
color: #0000FF;
}
-->
</style>
</head>

<body>
I have created a menu using Flash. I have 5 options that I want to be rollovers, and links. How would I convert <a href="../images/menu.fla">this file</a> so it would do that?
</body>
</html>

That works, but your question is different than the source of your page.
BonRouge
05-10-2005, 08:04 PM
*cough* I think he's referring to the link that links to the Flash file..
Ok... :o I guess I was confused because as you said - that doesn't look like the question. Not a mind reader...
Herrjosua
05-10-2005, 08:58 PM
Sorry guys, I posted the wrong link. Try this one on for size.
Source (http://www.howlingwolfstudios.net/html/help.htm)
David Harrison
05-10-2005, 11:34 PM
You're over-ruling all of your styles with this one earlier on:body {color:#000000;
font-family:Georgia, "Times New Roman", Times, serif;
font-size:36px;
font-weight:bold;
color:#FF0000;
background-color:#000000;
text-decoration:underline;
text-align:center
}
Herrjosua
05-11-2005, 06:51 AM
So then I need to make another inline style sheet for the underlined text then?
Thanks
Siddan
05-11-2005, 07:44 AM
stylesheet is an external file that is filled with Css commands, attributes

you do not need to make an inline css command as Bon Rouge mentioned

but you can use an inline tag like <span> instead. Just remove the underline decoration within the Body and make a new class

example
.uline {text-decoration:underline}


bla bla bla here are some text and this <span class="uline">word</span> is underlined
................

or have I totally misunderstood you?
Herrjosua
05-11-2005, 09:23 PM
So I would create a third external style sheet and then call it with the span?
Or am I completely missing the idea?
Thanks
Josh
ray326
05-11-2005, 09:31 PM
Or am I completely missing the idea?That sums it up. Is this just random text you want to underline or does it have some meaning within the context of your document? If so, what IS that meaning?
JPnyc
05-11-2005, 09:32 PM
You create one external stylesheet (except in very unusual circumstances), on it you create many style rules. If you have only 1 span tag, or if all span tags have the same style, then style the span tag itself.

span { attribute: value; }
BonRouge
05-11-2005, 09:32 PM
What do you want to be underlined?
Herrjosua
05-12-2005, 08:27 AM
Basiclly I want the title to be underlined. The rest of the text I do not want to underlined. So your telling me I can have one external style sheet with different styles on it?
Thanks
Again
JPnyc
05-12-2005, 08:37 AM
Yes, it's very rare to need more than one ext. CSS. The only reason I can think of is if you want to present the user a choice of styles, and then you could use javascript to change the stylesheet being referenced in the link tag. Basically css works like this:

You can target a tag name as your CSS selector, in this case span, or you can assign a class to target only some of a particular kind of tag, or you can assign an ID if you want to affect just ONE tag. I don't know your entire situation but you could do this, if there's only one span, or if you want ALL the spans to be underlined.

span { text-decoration:underline }
ray326
05-12-2005, 09:23 AM
Basiclly I want the title to be underlined.A "title" should be marked up as a heading and styled accordingly.
Herrjosua
05-12-2005, 11:01 AM
Ok I have one style sheet for the body that includes this code:
body {color:#000000;
font-family:Georgia, "Times New Roman", Times, serif;
font-size:18px;
font-style:italic;
color:#FF0000;
background-color:#000000
}
a:link {
color: #FFFFFF;
}
a:visited {
color: #FFFFFF;
}
a:hover {
color: #0000FF;
}
The one below is for my title text:

body {color:#000000;
font-family:Georgia, "Times New Roman", Times, serif;
font-size:36px;
font-weight:bold;
color:#FF0000;
background-color:#000000;
text-decoration:underline;
text-align:center
}
a:link {
color: #FFFFFF;
}
a:visited {
color: #FFFFFF;
}
a:hover {
color: #0000FF;
}


How would I covert these two into one style sheet? I know I can remove the duplicate items.
David Harrison
05-12-2005, 11:16 AM
Like this:h1{
/* All of these rules will affect the level 1 header. */
}

<h1>This Is The Title</h1>
ray326
05-12-2005, 01:56 PM
What you've got are two style sheets that both apply to the <body> and <a> tags. Assuming the first body selector is really for the body and the second body selector is really for h1 then.

body {color:#000000;
font-family:Georgia, "Times New Roman", Times, serif;
font-size:18px;
font-style:italic;
color:#FF0000;
background-color:#000000;
}
a:link {
color: #FFFFFF;
}
a:visited {
color: #FFFFFF;
}
a:hover {
color: #0000FF;
}
h1 {
font-size:36px;
font-weight:bold;
font-style:normal;
text-decoration:underline;
text-align:center;
}
Herrjosua
05-12-2005, 03:11 PM
One more question. On my welcome page, I have some text that I want to smaller than the normal text, would I just create another header entry into my external style sheet?
JPnyc
05-12-2005, 03:14 PM
Can't have 2 of the same selectors in the css. You'll only see the styling of the last one. Make the other an h2 or h3.
ray326
05-12-2005, 11:04 PM
I have some text that I want to smaller than the normal text
That's probably a good place for a class.

.smalltext { font-size: 75% }

Then you can apply that class to an element. So for a paragraph with small text,

<p class="smalltext">Here's a paragraph that would be good for legal stuff like terms of use, copyrights, licenses and other stuff you really don't want someone to read.</p>