CSS not updating table "body" font via DWT

G

Guest

I'm a newbie. I created a Dynamic Web Template in FP2003 and organized it
with a layout table. I attached a css to the template and created a editable
region (presumably the "body"). When I change h1 and h2 in the css, the
editable text changes appropriately in the web pages attached to the dwt; the
default text in the editable region remains "Normal" at 3 (12pt) Times New
Roman even if I change the font in the css body to something else. The css
sheet I am using is below. Any help in being able to change from the default
12pt is greatly appreciated. Thanks.

<html> <head> <meta http-equiv="content-type" content="text/html;
charset=windows-1252"> <title>new page 1</title> <style>{ }
a:active { font-family: sans-serif; text-decoration: none; font-weight:
bold; color:#FFFFFF }
a:link { font-family: sans-serif; text-decoration: none; font-weight:
bold; color:#FFFFFF }
a:visited { font-family: sans-serif; text-decoration: none; font-weight:
bold; color:#FFFFFF }
a { font-family: sans-serif; text-decoration: none; font-weight:
bold; color:#FFFFFF }
body { color: #FFFFFF; background-color: #006699; font-family:Times
New Roman; font-size:18pt }
h1 { font-family: serif; font-size: 24pt; font-weight: bold; }
h2 { font-family: sans-serif; font-size: 14pt }
-->
</style>
</head>

<body>

</body>

</html>
 
S

Stefan B Rusynko

CSS does not cascade from the body tag into many tags (like tables, li, etc) in most browsers
If using tables in your layout Add the table cells to your style as
body, td, th { color: #FFFFFF; background-color: #006699; font-family:Times New Roman; font-size:18pt }

--




| I'm a newbie. I created a Dynamic Web Template in FP2003 and organized it
| with a layout table. I attached a css to the template and created a editable
| region (presumably the "body"). When I change h1 and h2 in the css, the
| editable text changes appropriately in the web pages attached to the dwt; the
| default text in the editable region remains "Normal" at 3 (12pt) Times New
| Roman even if I change the font in the css body to something else. The css
| sheet I am using is below. Any help in being able to change from the default
| 12pt is greatly appreciated. Thanks.
|
| <html> <head> <meta http-equiv="content-type" content="text/html;
| charset=windows-1252"> <title>new page 1</title> <style>{ }
| a:active { font-family: sans-serif; text-decoration: none; font-weight:
| bold; color:#FFFFFF }
| a:link { font-family: sans-serif; text-decoration: none; font-weight:
| bold; color:#FFFFFF }
| a:visited { font-family: sans-serif; text-decoration: none; font-weight:
| bold; color:#FFFFFF }
| a { font-family: sans-serif; text-decoration: none; font-weight:
| bold; color:#FFFFFF }
| body { color: #FFFFFF; background-color: #006699; font-family:Times
| New Roman; font-size:18pt }
| h1 { font-family: serif; font-size: 24pt; font-weight: bold; }
| h2 { font-family: sans-serif; font-size: 14pt }
| -->
| </style>
| </head>
|
| <body>
|
| </body>
|
| </html>
| --
| BA Finstead
 
R

Ronx

Is the CSS in an external style sheet, or embedded in the DWT?
The code you have posted is neither of these, and will not affect any of the
pages attached to the DWT.

You should create styles for other tags, like p, td, th, as well as body.

An external css sheet does not have any HTML elements on it,
yours should be:

a { font-family: sans-serif; text-decoration: none; font-weight: bold;
color:#FFFFFF }
a:active { font-family: sans-serif; text-decoration: none; font-weight:
bold; color:#FFFFFF }
a:link { font-family: sans-serif; text-decoration: none; font-weight:
bold; color:#FFFFFF }
a:visited { font-family: sans-serif; text-decoration: none; font-weight:
bold; color:#FFFFFF }
body,p,td,th { color: #FFFFFF; background-color: #006699;
font-family:"Times New Roman"; font-size:18pt }
h1 { font-family: serif; font-size: 24pt; font-weight: bold; }
h2 { font-family: sans-serif; font-size: 14pt }



and (apart from more styles) absolutely nothing else.
Notice that I have moved the a style above the pseudo link styles -
left below the a would overwrite the pseudo link styles. Also, Times New
Roman should be quoted.
 
G

Guest

Thanks.

Ronx said:
Is the CSS in an external style sheet, or embedded in the DWT?
The code you have posted is neither of these, and will not affect any of the
pages attached to the DWT.

You should create styles for other tags, like p, td, th, as well as body.

An external css sheet does not have any HTML elements on it,
yours should be:

a { font-family: sans-serif; text-decoration: none; font-weight: bold;
color:#FFFFFF }
a:active { font-family: sans-serif; text-decoration: none; font-weight:
bold; color:#FFFFFF }
a:link { font-family: sans-serif; text-decoration: none; font-weight:
bold; color:#FFFFFF }
a:visited { font-family: sans-serif; text-decoration: none; font-weight:
bold; color:#FFFFFF }
body,p,td,th { color: #FFFFFF; background-color: #006699;
font-family:"Times New Roman"; font-size:18pt }
h1 { font-family: serif; font-size: 24pt; font-weight: bold; }
h2 { font-family: sans-serif; font-size: 14pt }



and (apart from more styles) absolutely nothing else.
Notice that I have moved the a style above the pseudo link styles -
left below the a would overwrite the pseudo link styles. Also, Times New
Roman should be quoted.
Click to expand...
 
G

Guest

Many thanks to Stefan and Ron. The css is external, but was created using
erroneous instructions, hence the HTML code. I clearly need to read more on
css. Any suggestions? Thanks again.
 
R

Ronx

Start here:
http://www.w3schools.com/css/default.asp

To create a style sheet in FrontPage:

File->New
On the task pane, choose More page templates
Then choose the Style Sheets tab and pick a sheet to base your changes on.
(Note that the styles for table borders in the CSS templates are for IE
only).
 
G

Guest

I applied the css you so kindly provided, and it works well. An
unanticipated consequence (or perhaps independent phenomenon): now, on the
DWT, the dotted lines on the table layout view have gone! Formerly, and in
other DWTs, in the design view with "Show Layout Tool" in the toolbar NOT
highlighted, there are dashed lines indicating boundaries on the web page;
now, they are gone. With the "Show Layout Table" button highlighted, here
are solid lines with pixel size indicators; when the button is pressed again,
the background turns black and the solid lines disappear. I have tried
converting the table from conventional to layout via the Tools properties
menu, but to no avail. Help again appreciated. Thanks.
 
C

Chris Leeds, MVP-FrontPage

I've owned several books on css and my all time favorite is html utopia from
www.sitepoint.com it's about table-less design, but even applying the
principals to table based layout is easy.

the way the information is delivered by the author just seemed to "jive" for
the way I learn.

HTH

--
Chris Leeds,
Microsoft MVP-FrontPage

ContentSeed: great tool for web masters,
a fantastic convenience for site owners.
http://contentseed.com/
--
 
R

Ronx

Building a page with a layout table and "my" CSS, I get a table outlined
with white dashed lines on a blue background.

Clicking the "Show Layout tool" button selects the table, and it turns
black, with pink dashed lines delineating the cells.

Click anywhere in the table, and its back to blue background with white
lines.
 
G

Guest

More operator error. Redid the DWT and attached pages, applied your css, and
all is well! Thanks again.

BA Finstead
 

Ask a Question

Want to reply to this thread or ask your own question?

You'll need to choose a username for the site, which only take a couple of moments. After that, you can post your question and our members will help you out.

Ask a Question

Similar Threads

Hyperlinks NOT underlined in website using CSS 3
Print from Explorer 7. does not work 1
CSS woes.... 15
Problems using CSS in IE6 1
how can I use two different hyperlink styles on the same page? 4
DWT with CSS 2
CSS Problems 8
Style sheets not working 3

Top