How to keep site elements in the same place all the time?

Question

How to keep site elements in the same place all the time?

Navigation

#1 by (2 votes)

1

I have the following HTML code:

<div id="geral">

<p class="texto_grande_titulo">...</p> 
                          ...
 </div>

In CSS:

div#geral{ background-image:url(../imagens/borda.png);
    background-repeat:no-repeat;
    width: 802px;
    height: 719px;
    margin:auto;
    margin-top: 160px;
    }

And I want to know how I can make this div stay in the same place so that by scrolling down the div does not follow. As the stack site, you may notice that zooming or zooming out all elements of the page same location, what does not happen on my site, what is the best way to do this without using bootstrap?

html jquery css

asked by anonymous 12.02.2017 / 17:50

1 answer

I'm making a game, and on line 36 gave this error Uncaught ReferenceError: resetInterval is not defined. Can anybody help me? Send a list of objects to Spring using Thymeleaf

score 2 · Answer 1

div#geral{ background-image:url('http://kithomepage.com/images/Imagem003.jpg');
    background-repeat:no-repeat;
    width: 802px;
    height: 719px;
    position:fixed; 
    top:100px;
    left:0
}

<div id="geral">

<p class="texto_grande_titulo">TextoParagrafo TextoParagrafo TextoParagrafo TextoParagrafo TextoParagrafo</p> 
                          TextoDiv TextoDiv TextoDiv TextoDiv 
 </div>
<p>bla bla bla</p>
<p>bla bla bla</p>
<p>bla bla bla</p>
<p>bla bla bla</p>
<p>bla bla bla</p>
<p>bla bla bla</p>
<p>bla bla bla</p>
<p>bla bla bla</p>
<p>bla bla bla</p>
<p>bla bla bla</p>
<p>bla bla bla</p>
<p>bla bla bla</p>
<p>bla bla bla</p>
<p>bla bla bla</p>
<p>bla bla bla</p>
<p>bla bla bla</p>
<p>bla bla bla</p>
<p>bla bla bla</p>
<p>bla bla bla</p>

O position: fixed; will set the position of the element in the coordinate that you set. As the page is rolled, the element remains fixed at the position you set and the page content scrolls normally.

The position of an element with fixed position (position: fixed;) is defined in relation to the "viewport", ie the browser window itself. When we roll the page, the "viewport" does not change, so the element will stay exactly where it is.

The fixed value in the position attribute works on all browsers, but in case Internet Explorer only works in version 7 and above.

To work, you have to declare yourself a DOCTYPE!

Mobile device browsers have unstable support to fix. Read more about the situation link .