ცენტრირება აბსოლუტურით CSS-ში

არსებობს ელემენტის ცენტრირების ჭკვიანური მეთოდი აბსოლუტური პოზიციონირების გამოყენებით. შესაძლებელია ისე მოვიქცეთ, რომ ელემენტი ბრაუზერის ფანჯრის ზუსტად ცენტრში განთავსდეს. ამისთვის ელემენტს არ უნდა მივუთითოთ ზომები და ამავდროულად მივანიჭოთ პოზიციონირება ოთხივე მხრიდან:

html<div id="elem"></div>
css#elem {
  position: absolute;
  top:    30px;
  right:  30px;
  bottom: 30px;
  left:   30px;
  
  border: 1px solid green;
}

Результат:

Задание 1

აღწერილი მეთოდის გამოყენებით შექმენით ბლოკი, რომელიც მდებარეობს ეკრანის ცენტრში და აქვს ჩამოსხვა ყველა მხრიდან 100px.

Задание 2

აღწერილი მეთოდის გამოყენებით შექმენით ბლოკი, რომელსაც აქვს ჩამოსხვა ზემოდან ეკრანის კიდიდან 100px, მარჯვნიდან - 200px, ქვემოდან - 50px, მარცხნიდან კი - 10px.