<Font> and <B> confusion in frontpage

cmuir
cmuir used Ask the Experts™
on
Hi,

I have noticed that in frontpage(2000) that when I make some text Bold and then change the font characteristic of the text it looks fine in preview mode but not when I publish it and view with IE5.5 sp2 (it does not have the colours)

The code Frontpage produces is

<font size="2" face="Verdana" color="#009999"><b>my text</b></font>

which when I look at it in IE5.5 does not have any of the color properties.

If I then manually swap the code around to have the <b>s outside the <font>s as ..

<b><font size="2" face="Verdana" color="#009999">my text</font></b>

It reads fine.

Is this a MS Frontpage feature or can I fix it?

Hope you can help

Regards

Charlie
Comment
Watch Question

Do more with

Expert Office
EXPERT OFFICE® is a registered trademark of EXPERTS EXCHANGE®

Commented:
Either way it should work fine..

By right..

<font size="2" face="Verdana" color="#009999"><b>my text</b></font>

Is the correct way....

Or if it does not work still.. consider using CSS..

<STYLE TYPE="TEXT/CSS">
font { font-style:bold; }
</STYLE>


By right.. i believe it is your IE's problem :-) Never heard of anyone having this problem before..

Thanks
Aaron

Author

Commented:
I have tried it on a few machines now see page

http://www.ovingtonboats.com/content/i14/boatinfo.htm

the section "the dinghy world just watched in awe!" should be in white as per the code

<font color="#FFFFFF" face="Verdana, Arial, Helvetica, sans-serif" size="2"><b>the
      dinghy world just watched in awe!</b></font>

same with the "Specification" section at the bottom of the page.

Any clues??
Commented:
Dude..

This is because you used HTML + CSS. which Cause the problem..

Open your style sheets.. You will see..

<STYLE TYPE="TEXT/CSS">
A:link {color:blue; text-decoration:none; font-weight:bold}
A:visited {color:purple; text-decoration:none; font-weight:bold}
A:active {color:red; text-decoration:none; font-weight:bold}
A:hover {colour:red; text-decoration:none; font-weight:bold}

BODY {background-color: white; color: black; font-size: 10pt; font-family: Arial, Verdana, sans-serif}

H1 {color:black; font-size:16pt; font-weight: bold; font-family: Arial, Verdana, sans-serif}
H2 {color:black; font-size:14pt; font-weight: bold; font-family: Arial, Verdana, sans-serif}
H3 {color:black; font-size:12pt; font-weight: bold; font-family: Arial, Verdana, sans-serif}
H4 {color:black; font-size:10pt; font-weight: bold; font-family: Arial, Verdana, sans-serif}
H5 {color:black; font-size:8pt; font-weight: bold; font-family: Arial, Verdana, sans-serif}
H6 {color:black; font-size:7pt; font-weight: bold; font-family: Arial, Verdana, sans-serif}

.blueH1 {color:#333366; font-size:16pt; font-weight: bold; font-family: Arial, Verdana, sans-serif}
.blueH2 {color:#333366; font-size:14pt; font-weight: bold; font-family: Arial, Verdana, sans-serif}
.blueH3 {color:#333366; font-size:12pt; font-weight: bold; font-family: Arial, Verdana, sans-serif}
.blueH4 {color:#333366; font-size:10pt; font-weight: bold; font-family: Arial, Verdana, sans-serif}
.blueH5 {color:#333366; font-size:8pt; font-weight: bold; font-family: Arial, Verdana, sans-serif}
.blueH6 {color:#333366; font-size:7pt; font-weight: bold; font-family: Arial, Verdana, sans-serif}

.tealH1 {color:#339999; font-size:16pt; font-weight: bold; font-family: Arial, Verdana, sans-serif}
.tealH2 {color:#339999; font-size:14pt; font-weight: bold; font-family: Arial, Verdana, sans-serif}
.tealH3 {color:#339999; font-size:12pt; font-weight: bold; font-family: Arial, Verdana, sans-serif}
.tealH4 {color:#339999; font-size:10pt; font-weight: bold; font-family: Arial, Verdana, sans-serif}
.tealH5 {color:#339999; font-size:8pt; font-weight: bold; font-family: Arial, Verdana, sans-serif}
.tealH6 {color:#339999; font-size:7pt; font-weight: bold; font-family: Arial, Verdana, sans-serif}

B {color:black; font-size: 10pt; font-weight: bold; font-family: Arial, Verdana, sans-serif}
I {color:black; font-size: 10pt; font-style: italic; font-family: Arial, Verdana, sans-serif}
strike {color:red; font-size: 10pt; text-decoration: line-through; font-family: Arial, Verdana, sans-serif}
em {color:#fc6c02; font-size: 10pt; font-weight: bold; font-family: Arial, Verdana, sans-serif}
P {color:black; font-size: 10pt; font-family: Arial, Verdana, sans-serif}
td {color:black; font-size: 10pt; font-family: Arial, Verdana, sans-serif}
li {color:black; font-size: 10pt; font-family: Arial, Verdana, sans-serif}

dt {color:#333366; font-size: 10pt; font-weight: bold; font-family: Arial, Verdana, sans-serif}
dd {color:#339999; font-size: 10pt; font-family: Arial, Verdana, sans-serif}

.orangeheaderbox {background-color : orange; color:black; font-size: 12pt; font-weight: bold; font-family: Arial, Verdana, sans-serif}
.blueheaderbox {background-color : #333366; color:white; font-size: 12pt; font-weight: bold; font-family: Arial, Verdana, sans-serif}
.tealheaderbox {background-color : #339999; color:white; font-size: 12pt; font-weight: bold; font-family: Arial, Verdana, sans-serif}
</STYLE>


---------------------------------------------



The fault lies in this line:
B {color:black; font-size: 10pt; font-weight: bold; font-family: Arial, Verdana, sans-serif}

You see that?? That means.. BOLD TEXT are BLACK..

So if you want it to any predefine color you set.. by typing this:
<font color="#FFFFFF" face="Verdana, Arial, Helvetica, sans-serif" size="2"><b>the dinghy world just watched in awe!</b></font>




All you have to do it to remove.. COLOR: BLACK


So in other words.. change the existing B style sheet..

To...
B {font-size: 10pt; font-weight: bold; font-family: Arial, Verdana, sans-serif}

I tried and it work now :-)

Thanks
Aaron

Author

Commented:
Ahhahahhh! Thanks for that aarontwc - what a tw*t I feel now - thanks very much for your investigations and I will go away now and see what other cock ups I have made.

Thanks again

Charlie

Do more with

Expert Office
Submit tech questions to Ask the Experts™ at any time to receive solutions, advice, and new ideas from leading industry professionals.

Start 7-Day Free Trial