css - px値を使用して背景を右下に相対的に配置する

Question

background-imageを左右から一定の距離に配置したいと思います。コーナーに配置され、％または距離によってデザインが応答しなくなる
ため、使用したくありません。 そのためのCSSソリューションはありますか？right borromleft top

Answer 1

はい、このようなことをcalcで試すことができます。

.wrapper {
  background-image: url(http://www.bcebhagalpur.ac.in/images/Facebook.png);
  background-repeat: no-repeat;
  background-position: calc(100% - 40px) calc(100% - 40px);
  height: 300px;
  width: 50%;
  background-color: #DDD;
}

<div class="wrapper">
  <p>Lorem Ipsum Dolor set amet etc etc etc etc .....</p>
</div>

または、4辺の配置だけでそれを行うことができます:

.wrapper {
  background-image: url(http://www.bcebhagalpur.ac.in/images/Facebook.png);
  background-repeat: no-repeat;
  background-position: right 40px bottom 40px;
  height: 300px;
  width: 50%;
  background-color: #DDD;
}

<div class="wrapper">
  <p>Lorem Ipsum Dolor set amet etc etc etc etc .....</p>
</div>

Answer 2

これを使って

.position
{
position:fixed;
right:200px;
bottom:150px;
}