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 Westi on being selected by the Tek-Tips community for having the most helpful posts in the forums last week. Way to Go!

Background Problem 1

Status
Not open for further replies.
FoxEgg

FoxEgg

Programmer
Mar 24, 2002
749
AU
I have made a very simple web page


Two problems with the background:

1. It scrolls when viewed in Mozilla Firefox... It is fixed in Internet Explorer

2. In both, I cannot get the image to stretch to full screen ... there is an annoying margin...

Any suggestions ? What am I doing wrong ?

Would you mind looking at the source code and spotting the error.


Thank you
 
Sort by date Sort by votes
Thanks TG... I obviously didn't know that was a problem...

Can I ask how to merge the two...

One has the "fixed" and the other the background..

JF

 
Upvote 0 Downvote
I just tried a merge

<body bgproperties="fixed" background="chds02small.jpg" bgcolor="#C0C0C0">

Still sam problem...

JF
 
Upvote 0 Downvote
You have:
Code: 
<body bgproperties="fixed" bgcolor="#C0C0C0">
<body background="chds02small.jpg" bgcolor="#024D4D">
try
Code: 
<body background="chds02small.jpg"  bgproperties="fixed" bgcolor="#024D4D">
I don't know if that'll fix your problem or not. I ususally use styles for this stuff.




traingamer
 
Upvote 0 Downvote
try a stylesheet with:
Code: 
body { 
   background-color: #024D4D;
   background-image: url(chds02small.jpg);
   background-position: center center;
   background-repeat: no-repeat;
   background-attachment: fixed;
   }
then just a <body> tag with no attributes


traingamer
 
Upvote 0 Downvote
[tt]background[/tt] and [tt]bgproperties[/tt] are not valid attributes in html. The first is however correctly interpreted by most browsers where the second one I guess it is not (only IE accepts it). That being the case, your best bet is to go with traingamer's code of putting it into the stylesheet.
 
Upvote 0 Downvote
In both, I cannot get the image to stretch to full screen
Click to expand...
True. There's no way to get a background image to stretch in this way. Either you show the image once, or you repeat it horizontally, vertically, or in both directions.

Frankly, it's probably a bad idea to use a big photograph as a background image. It takes a fairly long time to load, and it makes the text in front of it difficult to read. If you want to stick with this look, try desaturating the image in an image editor to get a paler version that text will show up over.

-- Chris Hunt
Webmaster & Tragedian
Extra Connections Ltd
 
Upvote 0 Downvote
Thanks to everyone for all the advice...

I will have to learn how to do "STYLE SHEETS" and how to embed that code into the web page HTML....

The original web page had a faded picture... but I can't remember the program that I used to fade it !!!! Duh !!!

This weekend I'll have a go at it again... learn some more stuff.. try and try again...

Many many thanks.

John Fox
 
Upvote 0 Downvote
Well, Traingamer, your Style sheet suggesion did what I wanted..

I must admit that I had not a bloody clue how to do a Style Sheet until then.... and then I looked for a Web Tutorial in Style sheets..

Ive sill got problems with the image and readability ... but ... hell I am miles ahead of this time last week
...


Thankyou to all



John Fox
 
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
770
3esolar
3
PeDa
  • Locked
  • Question
Horizontal rule and CSS problem 2
Replies
2
Views
694
PeDa
PeDa
garcosta
  • Locked
  • Question
CSS Coding for Gradient Color Background for all Platforms
Replies
3
Views
154
1DMF
1DMF
Everton1Blue
  • Locked
  • Question
Google reCaptcha problem
Replies
4
Views
230
Everton1Blue
Everton1Blue
csphard
  • Locked
  • Question
need help with footer h3 background-color. 2
Replies
8
Views
317
vacunita
vacunita

Part and Inventory Search

Sponsor

Back
Top