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

many to many - Django Rest Framework ManyToMany filter multiple values -

java - Jasper subreport showing only one entry from the JSON data source when embedded in the Title band -

Java Entity Manager - JSON reader was expecting a value but found 'db' -