Archived

This topic is now archived and is closed to further replies.

  • 0

Resolved Responsive/full-Width Mode: Not Possible To Supersize The Background?

Question

Posted · Report post

Hoping to upload a b/g image that fills the background entirely, no matter the browser window size. I'm using the full-width mode .. so from what I understand, can't activate the supersize option in settings.

We're ok with modern browser restrictions of css3, so can I use background-size: cover?

Danny has a nice option for this persons problem, but its not the same .. if I widen the browser window, the b/g image gets taller and eventually fits my screen, but I'm looking more natural browser window widths.

http://www.pagelines.com/forum/topic/22466-background-image-tile-not-fill-entire-page/

Example page in question: http://www.virtually-anywhere.com/wp/

On a big screen (apple 27" thunderbolt here) if you make the browser as tall as your desktop, and then make the width reasonable (third of screen), you'll see the white.

Let me know if I'm being unclear, been a long day of coding and design. :)

-Chris

Share this post


Link to post
Share on other sites

5 answers to this question

Posted · Report post

I'm using the full-width mode .. so from what I understand, can't activate the supersize option in settings.

Where did you hear this? I use a background, supersized, in full-width mode.

Also, you should check this... http://www.w3schools.com/css/css_background.asp

Just in case you want to use the CSS method.

And this would help too, to supersize: http://www.w3schools.com/cssref/css3_pr_background-size.asp

Share this post


Link to post
Share on other sites

Posted · Report post

Perhaps I'm confusing the supersized definition with what I'd like to happen: bg image fills the entire browser window, not just the width .. makes adjustments as necessary? And for the supersized part was just mentioning based on the parameters set in the pagelines > site options > color control section (see attached).

I'm familiar with the css method, but unsure how to add it into the custom code CSS area as i've had little progress in overriding whatever bg settings are happening.

Thank you.

C

post-27536-0-25270700-1351909903_thumb.p

Share this post


Link to post
Share on other sites

Posted · Report post

Hi there, you mean you're pasting the code in there and its not working? Try using !important on each css command to override the defaults, example below.

#foo {background-position: 0% !important;}

Share this post


Link to post
Share on other sites

Posted · Report post

Baddabing. Good ole' !important. Always forget about that guy..

That worked, thanks James. Props.

Share this post


Link to post
Share on other sites

Posted · Report post

The topic was marked as resolved.

Share this post


Link to post
Share on other sites