Homepage scaling

cactusplant

I'm having difficulties with my website on mobile devices. The homepage background doesn't seem to want to scale properly to smaller devices. Also I'm having difficulties with my footer not properly scaling to the screen res.

Would appreciate some help.

Many thanks.

Hikin' Mike

A link to your site may help...

cactusplant

Hikin' Mike wrote: »

A link to your site may help...

Doh. My bad.

http://www.elliotedwardsphotography.co.uk/

Lille Ulven

Hi cactusplant

I have been playing around with this in Firefox for a little while...
If I am right, than this code might help you out:

#sm-tile-image-yui_3_8_0_1_1462698557792_99 .sm-tiles-cover .sm-image {
	width: 100%;
	min-height: 0%;
}

Not certain if you are going to need the #sm-tile-image-yui_3_8_0_1_1462698557792_99 or not, possibly not...

Your current CSS code defines this area like this:

.sm-tiles-cover .sm-image {
	min-width: 100%;
	min-height: 100%;
}

And in my opinion a minimum of 100% in height and width, will always cause a photo not being scaled but cut off on smaller devices.

Good luck

Lille Ulven

cactusplant

Lille Ulven wrote: »

Hi cactusplant

I have been playing around with this in Firefox for a little while...
If I am right, than this code might help you out:

#sm-tile-image-yui_3_8_0_1_1462698557792_99 .sm-tiles-cover .sm-image {
	width: 100%;
	min-height: 0%;
}

Not certain if you are going to need the #sm-tile-image-yui_3_8_0_1_1462698557792_99 or not, possibly not...

Your current CSS code defines this area like this:

.sm-tiles-cover .sm-image {
	min-width: 100%;
	min-height: 100%;
}

And in my opinion a minimum of 100% in height and width, will always cause a photo not being scaled but cut off on smaller devices.

Good luck

Lille Ulven

Thanks for that.

I've come to decide that I think I'd like to distinguish between mobile device and desktop or distinguish by resolution to display a separate picture. Is that possible/easy to do?

Using my website on mobile devices is so horrid at the moment.