html - How to make background position doesn't change in a responsive website -


I have this issue that when the position of the background change changes in the size of the window and I want it in the same condition Stay, I have a background on the body of this page.

Like it:

  & lt; Body id = "bg" & gt; & Lt; P & gt; Here are some text & lt; / P & gt; & Lt; / Body & gt;  

CSS:

  # bg {background-image: url (../../images / img 1.jpg); Repeat Background: No Repetition; Background-shaped: 100% auto; Background-position: 25% 25%; }  

It looks like when the default screen size is:

http://i60.tinypic.com/2n03dsg.jpg

And this happens when the size screen changes:

What I should know is this: do I have to Have to use media queries or is there a less complicated way to do this?

If you want to fit the screen, you should get better background-size: cover ; .

Try this way:

  #bg {background: URL (../../images/img1jpg) 25% 25% not fixed; -WebKit-Background-Size: Cover; -MOZ-BACKGROUND-SHAPE: COVER; -o-background-shape: cover; Background size: cover; }  

Let me know that this will do the trick; -)


Comments

Popular posts from this blog

sqlite3 - UPDATE a table from the SELECT of another one -

c# - Showing a SelectedItem's Property -

javascript - Render HTML after each iteration in loop -