By using this site, you agree to our updated Privacy Policy and our Terms of Use. Manage your Cookies Settings.
438,785 Members | 1,072 Online
Bytes IT Community
+ Ask a Question
Need help? Post your question and get tips & solutions from a community of 438,785 IT Pros & Developers. It's quick & easy.

CSS not rendering text correctly; need help

P: n/a
Hi--

I have been working on some text with CSS, but have not been able to
get it to render correctly. For instance, h1 should be uppercase, and
the blockquote should render as italics. However, both are not.

The text doc is available at www.china-ready.com/colly/chapter04/text1.htm

Thanks in advance,

Following is the CSS:

/* CSS Document */

/* Specify blanket rules for all elements */
body {
margin: 10px;
border: 1px solid #000;
padding:10px;
font: normal 12px Verdana, Arial, Sans-serif;
line-height:150%;
}
/* paragraph styling */
p {
font: 12px verdana,arial,sans-serif;
text-indent:15px;
}
h1, h2 {
letter-spacing:1px;
}
h1 {
font-family: Georgia, Times, serif;
text-transform:uppercase;
}
h2 {
font-family: "Helvetica Neue", Arial, sans-serif;
text-transform:none;
font-style:italic;
}
/* Style the blockquote */
blockquote {
margin: 0 0 0 20px;
line-height:150%;
p {
font: italic small-caps bold 12px/150% verdana,arial,sans-serif
}

Feb 21 '07 #1
Share this Question
Share on Google+
4 Replies


P: n/a
Scripsit pa************@gmail.com:
www.china-ready.com/colly/chapter04/text1.htm
The markup is OK, though you might just as well use HTML 4.01 Strict (and
wrap the blockquote content inside a block level container). Except that you
don't have any CSS there, directly or indirectly.

To let browsers find your style sheet, say mystyle.css, add the following
into the <headpart:
<link rel="stylesheet" type="text/css" href="mystyle.css">
font: normal 12px Verdana, Arial, Sans-serif;
Please check the FAQ resources of this group (or any _good_ book on CSS)
before digging deeper.
blockquote {
margin: 0 0 0 20px;
line-height:150%;
p {
font: italic small-caps bold 12px/150% verdana,arial,sans-serif
}
You've forgotten the close the blockquote rule with "}".

In future, use the W3C CSS Validator or the WDG CSSCheck to spot syntax
errors in CSS.

--
Jukka K. Korpela ("Yucca")
http://www.cs.tut.fi/~jkorpela/

Feb 21 '07 #2

P: n/a
In article
<11**********************@j27g2000cwj.googlegroups .com>,
"pa************@gmail.com" <pa************@gmail.comwrote:
Hi--

I have been working on some text with CSS, but have not been able to
get it to render correctly. For instance, h1 should be uppercase, and
the blockquote should render as italics. However, both are not.

The text doc is available at www.china-ready.com/colly/chapter04/text1.htm

Thanks in advance,

Following is the CSS:
So why did you not apply the css in the url? As it happens, when
you apply your css, the <h1is rendered as all caps (in Firefox
at least). If you use

font-style: italic;

in the blockquote instructions, you will get italics.

You are making a few mistakes otherwise. For instance, do not use
px for font-size, easiest for you is this: use 100% for body and
go from there.

Forget about line height till you read up on it. Just leave it
out.

--
dorayme
Feb 21 '07 #3

P: n/a
On Feb 21, 3:18 pm, "Jukka K. Korpela" <jkorp...@cs.tut.fiwrote:
Scripsit paul.denlin...@gmail.com:
www.china-ready.com/colly/chapter04/text1.htm

The markup is OK, though you might just as well use HTML 4.01 Strict (and
wrap the blockquote content inside a block level container). Except that you
don't have any CSS there, directly or indirectly.

To let browsers find your style sheet, say mystyle.css, add the following
into the <headpart:
<link rel="stylesheet" type="text/css" href="mystyle.css">
font: normal 12px Verdana, Arial, Sans-serif;

Please check the FAQ resources of this group (or any _good_ book on CSS)
before digging deeper.
blockquote {
margin: 0 0 0 20px;
line-height:150%;
p {
font: italic small-caps bold 12px/150% verdana,arial,sans-serif
}

You've forgotten the close the blockquote rule with "}".

In future, use the W3C CSS Validator or the WDG CSSCheck to spot syntax
errors in CSS.

--
Jukka K. Korpela ("Yucca")http://www.cs.tut.fi/~jkorpela/
Thanks for catching this mistake; I thought I had linked up the css
and the html docs, but somehow the link got broken. I have relinked
them, and uploaded the document, and will run it thru CSS Check.

Thank you.

Feb 22 '07 #4

P: n/a
Jukka K. Korpela wrote:
Scripsit pa************@gmail.com:
>www.china-ready.com/colly/chapter04/text1.htm
blockquote {
margin: 0 0 0 20px;
line-height:150%;
p {
font: italic small-caps bold 12px/150% verdana,arial,sans-serif
}

You've forgotten the close the blockquote rule with "}".
Actually, it's more like he has an extraneous "p {".
Same effect, different solution.

--
John
Feb 22 '07 #5

This discussion thread is closed

Replies have been disabled for this discussion.