I run a creative writing website, one of our main activities is the promotion and advertising of creative writing competitions.
With the little css knowledge I've picked up I am, at the moment, trying to redesign the site using css.
A typical writing contest would run something like this
Name of Contest
Some general details
Some more general details
contact web or email address. (the hyperlink is blue)
I'd like to try placing text ads somewhere in the centre of the competitions in the hope that my readers might click on them.
As suggested above I'm new to css but I've figured out the following internal stylesheet:
<head>
<style type="text/css">
<!--
p { font:100%; margin:0; }
p.first { font:175%; }
p.second { font 70%; color: blue}
-->
</style>
<head>
<body>
<p class="first">ABC Writers Network 2nt Annual Writing Contest</p>
<p>prize details here</p>
<p>prize details here</p>
<p class="second">web address or email address here</p>
<body>
As there is a competition page for each month I'd like to use an external stylesheet but I can't figure out the code to attach it to my fonts.css, I'd appreciate some guidance. Does the body bit remain the same.
Ideally though I'd like to make the first line into a h3 header, as I understand Google reads headers as been important, But anytime I've attempted to do that there is always a line break between the first and second line.
So as I say not a strict adsense problem except in so far as the layout might encourage click throughs but any suggestions appreciated.
Kevin
Not A Strict Adsense Question
Started by
Kevin
, Aug 25 2005 05:14 PM
4 replies to this topic
#1
Posted 25 August 2005 - 05:14 PM
#2
Posted 26 August 2005 - 01:03 AM
to link to an external css style sheet I have been using -
to remove the padding from the heading did you try adding the following? -
i guess this should do it.
ABC Writers Network 2nt Annual
Writing Contest
let us know if that worked, cheers glen
<LINK rel="stylesheet" href="http://www.domain.net/stylesheet.css" type="text/css">
to remove the padding from the heading did you try adding the following? -
padding:0
i guess this should do it.
Quote
ABC Writers Network 2nt Annual
Writing Contest
prize details here
prize details here
web address or email address here
let us know if that worked, cheers glen
#3
Posted 26 August 2005 - 09:41 AM
glen, on Aug 26 2005, 06:03 AM, said:
to link to an external css style sheet I have been using -
to remove the padding from the heading did you try adding the following? -
i guess this should do it.
let us know if that worked, cheers glen
<LINK rel="stylesheet" href="http://www.domain.net/stylesheet.css" type="text/css">
to remove the padding from the heading did you try adding the following? -
padding:0
i guess this should do it.
let us know if that worked, cheers glen
Thanks for the reply Glen but unfortunately it's not working. I cut and pasted what you suggested into my fonts.css and a web page. The result was something like:
Writing Contest
prize details here
prize details here
web address or email address here
as you can see plenty of spacing but not colour.
If I use the following as an internal stylesheet:
<style type="text/css">
<!--
p { font:100%; margin:0; }
p.first { font:200%; }
p.second { font 70%; color: blue}
-->
</style>
and the following code in my page
<p class="first">ABC Writers Network 2nt Annual Writing Contest</p>
<p>prize details here</p>
<p>prize details here</p>
<p class="second">web address or email address here</p>
Then I do get something resembling what I'm after My problem is in figuring out how go declare the above style in an already created css files - fonts.css
The way it's looking though I think I'm going to have to stick to calling these as an internal stylesheet and start reading up on my css.
Kevin
#4
Posted 26 August 2005 - 01:41 PM
I don't quite understand the problem.
To add an external stylesheet serves (it even is XHTML valid):
And something like this (without attaching a stylesheet) should wok:
This should work.
To add an external stylesheet serves (it even is XHTML valid):
<link rel="stylesheet" type="text/css" href="http://www.site.com/style.css" />
And something like this (without attaching a stylesheet) should wok:
<html>
<head>
<style type="text/css">
.first { font: 200%; }
.second { font: 70%; color: blue}
</style>
</head>
<body>
<p>Some text here</p> <br />
<p class="first">Title1</p> <br />
<p class+"second">Title2 - the blue title</p>
</body>
</html>
This should work.
#5
Posted 27 August 2005 - 12:00 AM
sounds like you want to link to an external style sheet from within another external style sheet? your question is a bit vague.
if so then try this -
Read more here -http://www.w3.org/TR....html#at-import
in terms of color, the code i suggested was dealing only with the question of padding that you wanted to remove. If you want color and font size attributes etc then just add them to your class description in your stylesheet.
e.g.
you 2nd response is confusing because i thought you wanted to use H3 headings for the top line (not paragraphs).
cheers, glen
if so then try this -
Quote
6.3 The @import rule
The '@import' rule allows users to import style rules from other style sheets. Any @import rules must precede all rule sets in a style sheet. The '@import' keyword must be followed by the URI of the style sheet to include. A string is also allowed; it will be interpreted as if it had url(...) around it.
Example(s):
The following lines are equivalent in meaning and illustrate both '@import' syntaxes (one with "url()" and one with a bare string):
@import "mystyle.css";
@import url("mystyle.css");
The '@import' rule allows users to import style rules from other style sheets. Any @import rules must precede all rule sets in a style sheet. The '@import' keyword must be followed by the URI of the style sheet to include. A string is also allowed; it will be interpreted as if it had url(...) around it.
Example(s):
The following lines are equivalent in meaning and illustrate both '@import' syntaxes (one with "url()" and one with a bare string):
@import "mystyle.css";
@import url("mystyle.css");
Read more here -http://www.w3.org/TR....html#at-import
in terms of color, the code i suggested was dealing only with the question of padding that you wanted to remove. If you want color and font size attributes etc then just add them to your class description in your stylesheet.
e.g.
h3.shortstuff {padding:0;margin:0;color: XX; font: XX% etc...}
you 2nd response is confusing because i thought you wanted to use H3 headings for the top line (not paragraphs).
cheers, glen
0 user(s) are reading this topic
0 members, 0 guests, 0 anonymous users











