Responsive css background images -


i have website (g-floors.eu) , want make background (in css have defined bg-image content) responsive. unfortunately don't have idea on how except 1 thing can think of it's quite workaround. creating multiple images , using css screen size change images wanna know if there more practical way in order achieve this.

basically wanna achieve image (with watermark 'g') automatically resizes without displaying less of image. if it's possible of course

link: g-floors.eu

code have far (content part)

#content    {            background-image: url('../images/bg.png');             background-repeat: no-repeat;             position: relative;             width: 85%;                 height: 610px;            margin-left: auto;           margin-right: auto;        }    

if want same image scale based on size of browser window:

background-image:url('../images/bg.png'); background-repeat:no-repeat; background-size:contain; background-position:center; 

do not set width, height, or margins.


Comments

Popular posts from this blog

cron - how to properly run Python script with crontab on every system startup -

elasticsearch - Is the order of operations guaranteed in a bulk update? -

Slow performance first queries on SQL Azure -