CODEWITHSUNDEEP
htmlcss
Julian Robbins
Julian Robbins

Reputation: 1

Position Discord widget in certain spot on webpage

I have the premade widget, and I am trying to position it on lower right hand corner with a fixed position so it stays there regardless of scrolling. I for the love of me cannot get it to go where I want it to, it just stays under the content. Please help.

<iframe src="https://discord.com/widget?id=769639393924481044&theme=dark" width="350" height="500" allowtransparency="true" frameborder="0" sandbox="allow-popups allow-popups-to-escape-sandbox allow-same-origin allow-scripts"></iframe>

I have tried using a div as done on w3 schools, again unable to make it work.

<div.fixed><iframe src="https://discord.com/widget?id=769639393924481044&theme=dark" width="350" height="500" allowtransparency="true" frameborder="0" sandbox="allow-popups allow-popups-to-escape-sandbox allow-same-origin allow-scripts"></iframe></div.fixed>

Upvotes: 0

Views: 5359

Answers (1)

caramba
caramba

Reputation: 22490

<div.fixed> does not exist. You have to add a class. The name of the class can be what ever you like. In CSS you will then need the . to access the class. Something like this will work

.fix-me {
    position: fixed;
    bottom: 20px;
    right: 20px;
    background-color: orange;
    
    width: 100px;
    height: 100px;
}
<div class="fix-me">
  <div>what ever content</div>
</div>

Upvotes: 1

Related Questions