background image in modern portfolio

[yellowdog]

hi
I would like to achieve the following with my site that is using modern portfolio.
I would like to add a full size background like the Metro Theme when viewed on a desktop.

do any of you pro's know how I can do this without upsetting the responsiveness of the site?

I am slowly getting into CSS and have overcome a few little issues but this is out of my league I think.

thx in advance

[Brad Dalton]

Have you tried using the page i.d or adding a custom class in the layout settings for that specific page?

Then create a new rule using that class with your background-image declaration.

Or install a plugin http://wordpress.org/extend/plugins/background-per-page/screenshots/

---

Tutorials for StudioPress Themes.

[yellowdog]

ok I wil look at your suggestions

thx

[yellowdog]

Think i will use the plugin - looks way easier to me!

[yellowdog]

One more..I cant seem to work out the optimum size for my background image - in metro its 1440 x 900 but it seems to stretch to fit larger monitors?

It seems to use this class

<div class="backstretch" style="left: 0px; top: 0px; overflow: hidden; margin: 0px; padding: 0px; height: 1350px; width: 2526px; z-index: -999999; position: fixed;"><img style="position: absolute; margin: 0px; padding: 0px; border: none; width: 2526px; height: 1578.75px; max-width: none; z-index: -999999; left: 0px; top: -114.375px;" src="http://demo.studiopress.com/metro/files/2013/01/bg.jpg"></div>

I would like to implement this feature - can anybody advise or is it out of reach for a beginner?

[bandj]

backstretch is a jquery plugin that Brian first used on the Stretch theme. I think he talks about it on his blog.

if you use an image that is bigger, say 2000px X 1000px you could try adding background-size: contain; to your css

[Author]

Posts