Skip to content Skip to sidebar Skip to footer

How To Show A Div On Top Of The Page In Fixed Position?

I'm having some issues to keep my Loaded-Content image on a position:fixed. My Container loads an hidden content by clicking the button, with a transition the loaded content should

Solution 1:

Add CSS and specity that div class to be always on top

<style>
.sticky
 {
  position: fixed;   
  top : 0px;
  left : 0px;
  width : (specify) ;
  height : (specity here);
  }
 </style>

Solution 2:

you could do it with css

#IdName{
position: fixed;
top: 0px;
}

JSFIDDLE

you can learn css here


Solution 3:

You should always learn more about CSS before you actually use it.

In this situation, a few attributes will be used :

  • width
  • top
  • left (or right)
  • position

The whole code is this :

.selector {
    position: fixed;
    top: 0;
    left: 0; /* Or right:0; */
    width: 100%; /* Or change it if you want */
}

Change .selector to the selector you need.

Use position:fixed to fix the position in the page.
Specifying the top makes the distance from the top of the page and the element to be 0 all the time.
Specifying the left / right will also fix the distance between left / right and the element.
Finally, specifying the width will make a bar on top of your page.

Please, always search for it before you ask : Search


Post a Comment for "How To Show A Div On Top Of The Page In Fixed Position?"