CSS and random image question?

student101

11-07-2007, 01:40 PM

This is a two part question.

First part:

CSS wont work if used in my page when a linked CSS file is used already?
If I cut out a section of the CSS and paste it in my document it doesn't work.

Second part:
How to get random images based on CSS value entries?
Currently am using different CSS files for different pages.

Page_one.php => page_one.css attached.
Page_two.php => page_two.css attached.

This is not the way I prefer to code my sites.
How to fix?

abduraooft

11-07-2007, 02:36 PM

First part:
CSS wont work if used in my page when a linked CSS file is used already?
If I cut out a section of the CSS and paste it in my document it doesn't work.

The external CSS might be in a different folder, then the image paths will be relative to the CSS file, not with html

Second part:
How to get random images based on CSS value entries?
Currently am using different CSS files for different pages.
Page_one.php => page_one.css attached.
Page_two.php => page_two.css attached.

You haven't specified the element on to which you are applying image(hopefully background). Anyway the best methode to set a page dependent background is, to write that particular CSS in the same file.
PS: I don't think it's a PHP related question.

mlseim

11-07-2007, 02:42 PM

You can use inline CSS for things that change (in that one instance) ...

Example, the background image here will overwrite the one in the CSS file.
<body style="background: url(mynewpic.jpg);">

For random images, javascripting or PHP. I recommend PHP myself.

student101

11-07-2007, 08:24 PM

Thank you for your response here guys.
I may not have it to clear in my first question or problem.

On my page I have this:

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

I would like to have only this part in my pages head section, but still have the css file attached.
Currrently this does not work.

<head>
<link href="css/style.css" rel="stylesheet" type="text/css" />
<style type="text/css">
#header {
margin: 0px;
width: 774px;
height:100px;
background-image: url(../images/image_1.jpg);/* this part I would like to make random*/
background-repeat: no-repeat;
position:relative;
}
</style>
</head>

Any ideas?

mlseim

11-07-2007, 08:39 PM

Try this ... not fully what you're looking for, but it might trigger some ideas ...

<head>
<link href="css/style.css" rel="stylesheet" type="text/css" />
<link href="css/header.css" rel="stylesheet" type="text/css" />
</head>

This is the file called: header.css

#header {
margin: 0px;
width: 774px;
height:100px;
background-image: url(../images/image_1.jpg);/* this part I would like to make random*/
background-repeat: no-repeat;
position:relative;
}

It's OK to specify more than 1 CSS file in your <head> section.

Now the random part ... will be trickier.

student101

11-07-2007, 08:46 PM

Thanks, didn't see that one.

Here is the random part.

<img src="images/image_<?php echo(rand(1,3)); ?>.jpg" /> // This is for your idea in previous post.

//This is for my idea in my resolve
#header {
margin: 0px;
width: 774px;
height:100px;
background-image: url(../images/image_<?php echo(rand(1,3)); ?>.jpg);/* this part I would like to make random*/
background-repeat: no-repeat;
position:relative;
}

Have fun

Thanks again, will try it though.

student101

11-07-2007, 08:53 PM

Sorry forgot to add that you would name your image files like this:

image_1.jpg
image_2.jpg
image_3.jpg

Then it would work.

Cheers

matak

11-07-2007, 11:34 PM

awesome code!
thanks

student101

11-08-2007, 06:10 AM

Glad you like, but problem still not solved.

Inigoesdr

11-08-2007, 05:50 PM

Post the current code you're using and what exactly doesn't work.

student101

11-10-2007, 03:30 PM

Sorry never got the mail.

Problem is solved by copying entire CSS code above </head> section.

Cheers

VIPStephan

11-10-2007, 03:50 PM

Another waste of time of four members here due to the inability to switch on the brain before posting and to provide enough information. :mad: