Tek-Tips is the largest IT community on the Internet today!

Members share and learn making Tek-Tips Forums the best source of peer-reviewed technical information on the Internet!

Register Log in
  • Congratulations Chris Miller on being selected by the Tek-Tips community for having the most helpful posts in the forums last week. Way to Go!

Problem with Ext style sheet

Status
Not open for further replies.
SteveHigh

SteveHigh

Technical User
Jan 17, 2007
158
GB
Hello

I have several pages on a site and on which I wish to place certain styles (font, etc).

So, I have a basic.css file which lools like this:

body { background-color: #ffffff; font-family: verdana; margin: 10% 0% 0% 0%; text-align: justify }

That is all I have on the page - not a word more.

In the HTML file itself, I have placed this between the <HEAD> tags:

<LINK REL=StyleSheet HREF="basic.css">

When I visit the HTML page, however (I have them both on the server), I am not able to see the CSS elements I have stipulated in the basic.css file.

What am I doing wrong?

One further question, if I may. How would I place an image in the basic.css file which would appear in all the HTML pages I have (that is, in the same position). At the moment I have:

<IMG STYLE="position:absolute; WIDTH:632px; HEIGHT:83px" SRC="BarUse.jpg">

Do I simply place this is the basic.css file? Don't I need to reference it in the HTML file?

Many thanks.

Steve

 
Sort by date Sort by votes
That is all I have on the page - not a word more.
Click to expand...
If that's true then that could be a reason why. Please create a valid HTML page complete with a DOCTYPE and try again. If you have already done this, please post the full HTML page and full CSS file.


____________________________________________________________
Mark,
[URL unfurl="true"]http://aspnetlibrary.com[/url]

Need help finding an answer? Try the Search Facility or read FAQ222-2244.
 
Upvote 0 Downvote
Sometimes it also helps the browser if you tell it what is the type of the file you're linking to. So, changing your link to the following could help you out:
Code: 
<link rel="stylesheet" href="basic.css" [!]type="text/css"[/!] />

___________________________________________________________
[small]Do something about world cancer today: PACT[/small]
 
Upvote 0 Downvote
ca8msm: css files don't need a doctype or html.

Lets step back a second, you have this in a css file :

Code: 
body { background-color: #ffffff; font-family: verdana; margin: 10% 0% 0% 0%; text-align: justify }

The question is what do you have in your actual html file that calls your css file.

I mean between the <body> tags?

As it stands the only effect you are likely to notice is
the background color, which would be white.



----------------------------------
Ignorance is not necessarily Bliss, case in point:
Unknown has caused an Unknown Error on Unknown and must be shutdown to prevent damage to Unknown.
 
Upvote 0 Downvote
one more possibility is that you have your external sheet in a different directory than your HTML file, and aren't referencing it correctly in your <link> tag.

[monkey][snake] <.
 
Upvote 0 Downvote
Many thanks for getting back to me.

This is what I now have in the html file:


<HTML>
<HEAD>
<TITLE>School</TITLE>

<link rel="stylesheet" href="basic.css" type="text/css" />


</HEAD>

<Body>

<p>Text.</p>

<p>Text.</p>

<p>Text.</p>

</Body>

</HTML>

This is what I have in basic.css:

<IMG STYLE="position:absolute; TOP:25px; LEFT:25px; WIDTH:632px; HEIGHT:83px" SRC="BarUse.jpg">


body { background-color: #ffffff; font-family: verdana; margin: 10% 10% 0% 0%; text-align: justify }

if I try to alter say, the margins as follows (I don't want to do this, I was simply testing if it works:

body { background-color: #ffffff; font-family: verdana; margin: 50% 50% 0% 0%; text-align: justify }

I can see no variation.

Basic.css and the html file are in the same directory on the server.

Your help and comments are much appreciated.

Cheers

Steve



 
Upvote 0 Downvote
Do you have that img tag in the css stylesheet? If so, that is your problem. You cannot have html in a css stylesheet -- they are different languages and the parser can ignore everything after the html part.

___________________________________________________________
[small]Do something about world cancer today: PACT[/small]
 
Upvote 0 Downvote
vacunita said:
ca8msm: css files don't need a doctype or html.
Click to expand...
I'm well aware of that, and that's not what I said anyway. I asked the user to:
ca8msm said:
create a valid [!]HTML page[/!] complete with a DOCTYPE
Click to expand...


____________________________________________________________
Mark,
[URL unfurl="true"]http://aspnetlibrary.com[/url]

Need help finding an answer? Try the Search Facility or read FAQ222-2244.
 
Upvote 0 Downvote
O.k, don't want to argue with you.

Anyway, you are right, the OP does need a valid doctype.


Going back to the OP's problem:

Vrag is correct. Image tags cannot be placed inside a CSS file.

With the change you made, you should see your text start way down the page.

But first remove the img tag from the css file.



----------------------------------
Ignorance is not necessarily Bliss, case in point:
Unknown has caused an Unknown Error on Unknown and must be shutdown to prevent damage to Unknown.
 
Upvote 0 Downvote
Hello

Many thanks agin for your messages.

I have removed the image tag and can now se the changes to th margin which I have mad. A big thank you to you all!!

I was interested in getting to understand the margin tag so that I could fit a long narrow image along the top.

If I wanted this same image to appear in all the HTML pages that I have, and I cannot mix the html <img> tag in the basic.css file, do I then need to insert the <img> tag in each of my HTML tags and poition in at the top of each page so that it fits in neatly with the top margin I have now created (thank to you all here) in the basic.css file?

Cheers

Stve
 
Upvote 0 Downvote
You can either:

1. Put an image on every page.
2. Put an image as a background to your body (or other html element).

If you go with one, you can still use server-side includes (if available) to include the image tag on every page -- that way you do not have to edit all the pages to make a small change to your image.

Which approach to use depends on the usage of image. If it is there strictly for design, using background might be more appropriate. If it is actually a useful object on the page, using an image tag is better.

___________________________________________________________
[small]Do something about world cancer today: PACT[/small]
 
Upvote 0 Downvote
Status
Not open for further replies.

Similar threads

scorney
  • Locked
  • Question
background image with overlay which Hover when over a specific Area/Form
Replies
1
Views
703
3esolar
3
jizzer
  • Locked
  • Question
HTML/CSS Image map with multiple tool-tips
Replies
3
Views
1K
spamjim
spamjim
PeDa
  • Locked
  • Question
Horizontal rule and CSS problem 2
Replies
2
Views
637
PeDa
PeDa
CoolBreeze007
  • Locked
  • Question
Unable to make HTML element adjust with the resizing of the browser
Replies
0
Views
131
CoolBreeze007
CoolBreeze007
LyndonOHRC
  • Locked
  • Question
Need advice with printing on check stock
Replies
5
Views
238
LyndonOHRC
LyndonOHRC

Part and Inventory Search

Sponsor

Back
Top