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

Font discrepancy between tag and CSS

P: n/a
I've got a document that StarOffice converted into HTML, and I'm
trying to clean up the cuft that it generated. I put together some
basic styles, and tied using them: the results are puzzling. The style
definition is:

<STYLE>
<!--
@page { size: 8.5in 11in; margin: 0.79in }
div.res dl dt {
font-weight: bold;
line-height: 3;
text-decoration: underline; }
div.res dl dd { font-size: medium; }
div.res ul li { font: "Courier, serif"; }
.lead {
font-weight: bold;
line-height: 3;
text-decoration: underline;
text-indent: 0; }
.emp { font-weight: bolder; font-size: 1.2em; }
-->
</STYLE>

The StarOffice-generated HTML made extensive use of font tags, which I
am trying to eliminate.

<div class=res>

<p class="lead">
RECENT EXPERIENCE:
</p>

<p>
<span class="emp">name</span>,
address (dates):
</P>

<UL TYPE=DISC>

<LI>text</li>
<LI><P ><FONT FACE="Courier, serif">text
<LI><P ><FONT FACE="Courier, serif">text</FONT></P>
<LI><P ><FONT FACE="Courier, serif">text</P>
<LI><P ><FONT FACE="Courier, serif">text</FONT></P>
<LI><P ><FONT FACE="Courier, serif">text</FONT></P>
<LI><P ><FONT FACE="Courier, serif">text</FONT></P>
</UL>

Superficially it appear as though the text in the first li element
should be rendered the same as the text in the other li elements, but
it isn't. Also, if I try to include either of

font: "Courier, serif";
font-family: "Courier, serif";

in my definition of .emp, then it no longer renders in bold. Please
advise.

Note, this is not XHTML, so the missing ending tags (</font>, </p>)
should be legitimate.

--
Shmuel (Seymour J.) Metz, SysProg and JOAT <http://patriot.net/~shmuel>

Unsolicited bulk E-mail subject to legal action. I reserve the
right to publicly post or ridicule any abusive E-mail. Reply to
domain Patriot dot net user shmuel+news to contact me. Do not
reply to sp******@library.lspace.org

Jul 20 '05 #1
Share this Question
Share on Google+
3 Replies


P: n/a
"Shmuel (Seymour J.) Metz" <sp******@library.lspace.org.invalid>
wrote:
I've got a document that StarOffice converted into HTML,
Hmm. I've never examined StarOffice generated code before. But this
doesn't bode well...
and I'm
trying to clean up the cuft that it generated. I put together some
basic styles, and tied using them: the results are puzzling. The style
definition is:

<STYLE>
<!--
@page { size: 8.5in 11in; margin: 0.79in }
div.res dl dt {
font-weight: bold;
line-height: 3;
text-decoration: underline; }
div.res dl dd { font-size: medium; }
div.res ul li { font: "Courier, serif"; }
This means use a font called 'Courier, serif'. I doubt that any sucj
font exists. A more normal definition would be
font-family: Courier, monospace;
as Courier is a monospaced font, not a serif one.
(Typographically speaking monospaced and serif aren't mutually
exclusive but in web terms the monospaced quality is usually more
important.)

Note that if you use the font shorthand you must specify the size as
well as the family.
http://www.w3.org/TR/CSS2/fonts.html#propdef-font

.lead {
font-weight: bold;
line-height: 3;
text-decoration: underline;
text-indent: 0; }
.emp { font-weight: bolder; font-size: 1.2em; }
-->
</STYLE>
The StarOffice-generated HTML made extensive use of font tags, which I
am trying to eliminate.
Bravo.
<div class=res>

<p class="lead">
RECENT EXPERIENCE:
</p>

<p>
<span class="emp">name</span>,
address (dates):
</P>

<UL TYPE=DISC>
<LI>text</li>
<LI><P ><FONT FACE="Courier, serif">text
<LI><P ><FONT FACE="Courier, serif">text</FONT></P>
<LI><P ><FONT FACE="Courier, serif">text</P>
<LI><P ><FONT FACE="Courier, serif">text</FONT></P>
<LI><P ><FONT FACE="Courier, serif">text</FONT></P>
<LI><P ><FONT FACE="Courier, serif">text</FONT></P>
</UL>

Superficially it appear as though the text in the first li element
should be rendered the same as the text in the other li elements, but
it isn't.
Not rendered the same in what respect?
What happens when you correct the CSS syntax as outlined above?
Also, if I try to include either of

font: "Courier, serif";
font-family: "Courier, serif";

in my definition of .emp, then it no longer renders in bold. Please
advise.
Could be a number of things. I'd suggest fixing the syntax errors and
validating your code, then coming back and posting a URL if the
problem's still there.

BTW <span class="emp"> makes me think that the purpose is emphasis? In
that case <em> or <strong> would be more appropriate.
Note, this is not XHTML, so the missing ending tags (</font>, </p>)
should be legitimate.


The end tag for font is not optional in HTML 4.
The end tag for p is optional in HTML 4.
When using CSS it helps to include all optional end tag as it limits
the number of browser bugs that can apply.

Steve

--
"My theories appal you, my heresies outrage you,
I never answer letters and you don't like my tie." - The Doctor

Steve Pugh <st***@pugh.net> <http://steve.pugh.net/>
Jul 20 '05 #2

P: n/a
In <ko********************************@4ax.com>, on 07/09/2004
at 11:53 PM, Steve Pugh <st***@pugh.net> said:
This means use a font called 'Courier, serif'.
Whoops! Thanks; It worked fine when I removed the extraneous quotes.

Note that if you use the font shorthand you must specify the size as
well as the family.
Okay; I changed it to font-family.
Not rendered the same in what respect?
Font and font size.
What happens when you correct the CSS syntax as outlined above?
It works fine, as noted above.
BTW <span class="emp"> makes me think that the purpose is emphasis?
Indirectly; class=emp is for names of employers, and I did specify
emphasis. Which raises a stle question. Which is preferable?:

<p>
<span class="emp">name</span>,
address (dates):
</P>

<p>
<span class="emp">name</span>,
<address>address</address> (dates):
</P>

<p>
<address><span class="emp">name</span>,
address</address> (dates):
</P>
The end tag for font is not optional in HTML 4.
I've been removing the font tags entirely.
The end tag for p is optional in HTML 4.


Understood, but I want to be able to easily move to XHTML when it
becomes a bit better supported.

BTW, I would have responded earlier, but your article isn't in my news
feed; I had to pull it from google. I suspect that it got hit by the
rogue cancels.

Again, thanks for the assistance.

--
Shmuel (Seymour J.) Metz, SysProg and JOAT <http://patriot.net/~shmuel>

Unsolicited bulk E-mail subject to legal action. I reserve the
right to publicly post or ridicule any abusive E-mail. Reply to
domain Patriot dot net user shmuel+news to contact me. Do not
reply to sp******@library.lspace.org

Jul 20 '05 #3

P: n/a
"Shmuel (Seymour J.) Metz" <sp******@library.lspace.org.invalid>
wrote:
Steve Pugh <st***@pugh.net> said:

BTW <span class="emp"> makes me think that the purpose is emphasis?
Indirectly; class=emp is for names of employers, and I did specify
emphasis. Which raises a stle question. Which is preferable?:

<p>
<span class="emp">name</span>,
address (dates):
</P>


This one.
<p>
<span class="emp">name</span>,
<address>address</address> (dates):
</P>

<p>
<address><span class="emp">name</span>,
address</address> (dates):
</P>


<address> is for marking up the contact details of the author of the
document, not for marking up any old address.

Steve

--
"My theories appal you, my heresies outrage you,
I never answer letters and you don't like my tie." - The Doctor

Steve Pugh <st***@pugh.net> <http://steve.pugh.net/>
Jul 20 '05 #4

This discussion thread is closed

Replies have been disabled for this discussion.