CODEWITHSUNDEEP
htmlcssfacebook-likepositionfixed
psychoticpanda
psychoticpanda

Reputation: 5

Position: Fixed isn't fixed?

I am trying to have my facebook like button stay in the top left corner and as the user scrolls down it follows them... What is wrong with my code? It shows but as I scroll down it does not move with the scroll. Tested locally on both of the latest versions safari and firefox. Please help!

 topleft{
   position: fixed;
   top: 0;
   left: 0;
 }

<top> FACEBOOK "LIKE BUTTON" IFRAME CODE HERE </top>

Upvotes: 0

Views: 421

Answers (3)

Praveen Dabral
Praveen Dabral

Reputation: 2509

problem with this could be

for topleft class

.topleft{
position: fixed;
top: 0;
left: 0;
}

for topleft id

#topleft{
position: fixed;
top: 0;
left: 0;
}

otherwise it should work.

Upvotes: 1

Vimal Stan
Vimal Stan

Reputation: 2005

There's no top tag in HTML.

CSS class name selectors should be preceded by a . (period). 

 topleft{
   position: fixed;
   top: 0;
   left: 0;
 }

should be 

.topleft{
   position: fixed;
   top: 0;
   left: 0;
 }

Assigning the style you've created to the iframe should work.

 <iframe class="topleft" ...>
    ...
 </iframe>

JSFiddle

Upvotes: 1

middleinitial
middleinitial

Reputation: 659

You aren't selecting your like button properly. You need to add a class attribute for css selection.

Try something like

<div class="facebook">FACEBOOK IFRAME</div>

Notice the ".facebook" rather than just "facebook".

.facebook {
   position: fixed;
   top: 0;
   left: 0;
}

Upvotes: 2

Related Questions