The forum of the forums
Would you like to react to this message? Create an account in a few clicks or log in to continue.

background issues

2 posters

Go down

background issues Empty background issues

Post by V3N0M April 10th 2008, 12:11 pm

hi guys im having a bit of trouble atm with the forum that im trying to make. i have designed a background which can be seen here:
https://2img.net/r/ihimizer/img177/339/backgroundimgcopylm8.jpg
btw the middle isnt orange only for thsi sample i made.

the only problem is it works perfectly for the resolution of my screen (1280x800) but not on my pc which is 1024x768. because of this it throws the whole of the forum out of line on a different resolution screen. the code for this background is in the css stylesheet but i was wondering if there was a code i could use that would display a different picture depending on the screen resolution i.e. i could rado the image several times to fit each screen resolution. if not gthen is there anyway of haveing a background with those 2 bits on the sides that will work in all of the resolutions??

thanks for any help that anyone provides me Very Happy
avatar
V3N0M
New Member

Posts : 5
Reputation : 0
Language : English

Back to top Go down

background issues Empty Re: background issues

Post by V3N0M April 10th 2008, 7:19 pm

ok thought my last post could be considered a bit vague so i thought id take some screenshots to show you.

this is how i want my site to look and how the sides should be and this is how it shows at 1280x800:

background issues Goodmr7.th

this is perfect until you view it at any other resolution.lol

like this resolution(1024x768):

background issues Baddz1.th

is there anyway of making it look like the top on all of the resoltuions?
avatar
V3N0M
New Member

Posts : 5
Reputation : 0
Language : English

Back to top Go down

background issues Empty Re: background issues

Post by zakir321 April 10th 2008, 7:33 pm

Well, unfortunately there is only one html element for the main background what makes it difficult to create a dynamic background. To my current knowledge there is no good solution to apply two pictures for the overall background, but I'll do some research... maybe I'm going to find a solution, maybe not. This will maybe be possible once the browsers can interpret CSS version 3, but this won't happen in near future I guess... :/

Besides this, please avoid double posted unless seperated by 24h - use the edit button instead. Wink
avatar
zakir321
New Member

Posts : 0
Reputation : 2
Language : english

Back to top Go down

background issues Empty Re: background issues

Post by V3N0M April 10th 2008, 8:29 pm

sorry about the double post Embarassed

ive had an idea but i dont know if it will work...

as on the second screenshot up there the grey part stays behind the main obdy of the forum. which is what i want so is t possible to change the back bit to be the image but have the main body of the forum the same size?

this is the code that deals with this part:

#wrap {
width: 80%;
margin: 0px auto;
background-color: #1a1a1a;
background-image: url("");
background-repeat: repeat-x;
background-attachment: fixed;
border-color: #46494b;
border-width: 0px 0px 0px 0px;
border-style: solid;

padding: 5px;
}

i have put the image into the space in the code but it misses the edges out. when i changed the width to 100% the main body of the forum changed. is there not some way lof changing the code so that the width of the forum stays the same but the image size is diferent? i think this may solve it but i dont have the coding knowledge to be able to do it lol. Embarassed Embarassed
avatar
V3N0M
New Member

Posts : 5
Reputation : 0
Language : English

Back to top Go down

background issues Empty Re: background issues

Post by zakir321 April 11th 2008, 2:19 am

Well, sorry, but I see no solution to this. The ability to stretch background images will only be part of CSS3, what is still not implemented in the main browsers - they simply can't interpret it yet. Also, styles for specific screen resolution will only be realized with the next version of CSS. All I can offer is this:

You basically center your background image of the body. If you then have a fixed size for your wrap that fits exactly with the background, you can have a pretty good-looking solution for all resolutions. Let's have a look at how to solve this in the code:

First, we'd apply our background properly on the body. I've added some comments as well (everything between slash and asterisks):
Code:

body{
 background-image: url("IMAGE URL");
 background-repeat: repeat-y;/*the background repeats only vertically*/
 background-position: 50% 0px;/*centers the background*/
 background-color: #4a4a4a/*Choose the same color as the bg-border -  a dark gray*/
}

Now we change the wrap from a dynamic percentage value to a fixed pixel value:
Code:

#wrap{
 width: 800px;/*Change this value so it fits nicely with the background*/
}

I think the most people have a resolution of 1024x768, so you probably optimize the values so it looks best for this resolution. And feel free to ask if something remains unclear, of course. Smile
avatar
zakir321
New Member

Posts : 0
Reputation : 2
Language : english

Back to top Go down

background issues Empty Re: background issues

Post by V3N0M April 11th 2008, 12:23 pm

thanks for that i think that i will just try a plainer backgorund for now and ust use this for the main ebsite where i know it will work. thanks for all the help you have provided Very Happy btw when is css3 due for realease?? iwant it now lol!!!
avatar
V3N0M
New Member

Posts : 5
Reputation : 0
Language : English

Back to top Go down

background issues Empty Re: background issues

Post by zakir321 April 11th 2008, 3:09 pm

Who knows... well, I don't at least. Full support for CSS3 will take some time until it becomes standart for all browsers. To my knowledge, Opera 9 supports the most CSS3 features among the main browsers, but that's almost useless to say, because it's worthless to build a site that only works for opera 9...
avatar
zakir321
New Member

Posts : 0
Reputation : 2
Language : english

Back to top Go down

Back to top

- Similar topics

 
Permissions in this forum:
You cannot reply to topics in this forum