Background picture problem with resolution
-
As the title states, I am having problems with my picture with different resolutions. I have not tried using CSS as i don’t know how to use it >__>. So any help would be really helpful! ^__^. Well, when i switch to a resolution below 1680×1050, the picture intrudes into the middle section which i don’t like. And with any resolution higher, the pic goes “smaller” as it wouldn’t touch the side of the middle section anymore. Any help would be awesome! Thanks in advance! ^^
The blog I need help with is: (visible only to logged in users)
-
This can be taken care of with CSS, but the problem is that it then makes your blog effectively 1280px wide, and anyone on a lower width resolution will not see the right side of your blog and will have to scroll horizontally to be able to view all the contents. Horizontal scrolling is one of the top 10 things people on the web dislike the most.
-
Yeah i hate horizontal scrolling haha…is there a way to make it so that they dont have to do horizontal scrolling?
-
You would have to modify the CSS and make the content area about 340px narrower, which would make it only about 300px wide. That would also mean your header has to shrink by 340px in width as well. Or you would have to dump the sidebar, but even then the posting area would have to shrink in width from 680 to 460px.
-
-
If you expand the width of your browser while on the OP’s page, you will see that the content area stays centered in the window. What you have to do is stop that from happening and force a left margin that is the same as the width of the image. That means that the blog main area, which is 940px wide now effectively becomes 1280px wide (940 + 340 = 1280). That means anyone with a monitor under 1280px wide in resolution will have part of the right side of the blog hidden.
-
Ah, right, now I see the problem.
You could try making it a little lighter and putting it as the sidebar background. That could be pretty.
-
Yeah, I thought of mentioning that as well. Take it back to about a 40% opacity, perhaps 30% since the colors are quite strong.
-
So the tips that have so far registered in my brain is that i should make my posting area bigger???
-
-
What was suggested is that you change the opacity of your image and then use it as a background for the sidebar (reducing the width of the image to match the width of the sidebar and not use it as a background image to the left of the blog. That way it won’t make the blog too wide for normal monitors.
If you leave it the way it is, but set a left margin for the content area, then that will make the issue worse. If you want the images to the left, you have to NARROW the post area to about 300px wide.
-
Nuuuu!! The banner will take look bad if i narrow it >__<….hmmmm i guess I’ll try your 1st suggestion and see how it looks :P.
-
-
Once you get your image prepared and uploaded to your media library, the below code will work. You can go to 240px wide on the image. and then do this.
#primary { background:url("URL_of_new_image") repeat-y scroll 0 0 transparent; padding-left:20px; padding-top:20px; } -
-
just realized…..to save your changes on CSS…you have to upgrade/pay….guess I’ll just stick to this weird background then >#>
- The topic ‘Background picture problem with resolution’ is closed to new replies.
WordPress.com Forums 