Forum Moderators: not2easy

Message Too Old, No Replies

how to make background img look the same at any resolution

100% noob question

         

strantor

12:22 am on Nov 19, 2007 (gmt 0)

10+ Year Member



ok, i'll just go ahead and throw it out there, yes, this for my myspace page. please don't hate. well, i am new to this css stuff. what i'm trying to do is make my background image height always be 100% of the browser window it is occupying, and maintain it's ratio. the width can change based on resizing. here's what i have got right now:
<style>body.bodyContent{background-color: 0c0b37;background-position:top; background-repeat: no-repeat;background-image: url("http://example.net/image.jpg");background-attachment: fixed;background-size: autoSize;background-overflow:auto}
table.contactTable{width: auto;height: auto;}
table,tr,td{background-color: transparent;border-style: none;}

I have been searching for the code and tweaking for hours and it seems like this should be alot easier than what i'm making of it. the object is just to make the page look the same to someone who uses 800X600 as it looks to me in 1440X900, with reagards to the background.

[edited by: tedster at 6:11 am (utc) on Nov. 19, 2007]
[edit reason] remove specifics [/edit]

tedster

6:19 am on Nov 19, 2007 (gmt 0)

WebmasterWorld Senior Member 10+ Year Member



Hello strantor, and welcome to the forums.

I think I've got bad news for you. There is no way to resize a background image. It will always display at the same pixel sizes that it is natively. You can make it tile, and therefore repeat; you can use a background color that blends with it and sort of "takes over" where the image stops. But the background image cannot change its native size.

Xapti

10:56 pm on Nov 19, 2007 (gmt 0)

WebmasterWorld Senior Member 10+ Year Member



With CSS alone, it cannot be done until more advanced background properties are supported, such as in CSS3.

If you had control over HTML and CSS (for myspace you wouldn't), then you could do this, but without dipping your hand into another cup called JAVASCRIPT, you would NOT be able to keep the x-y ratio static. It would just stretch to fit any which way.

strantor

2:39 pm on Nov 20, 2007 (gmt 0)

10+ Year Member



well, that sucks. thanks for the help.