Помогите со границами

Question

.knopka:hover {
  background-color: rgb(85, 100, 79);
  font-size: 20px;
}

.kartinka {
  width: 350px;
  height: 250px;
}

.Game1 {
  margin-top: 20px;
  margin-left: 15px;
  border: 3px solid
}

.jopa {}

<div class="Game1">
  <img class="kartinka" src="https://www.digiseller.ru/preview/118855/p1_2369359_9784a101.jpg"><b> 
            <br> 1.Стоимость продукта=359 руб или 4$<br> 2.Жанр-Тактический шутер<br>3.Название продукта-Rainbow Six: Siege<Br> </b>

  <a href="https://plati.market/itm/tom-clancys-rainbow-six-siege-standart-wholesale-key/2369359" target="_blank">
    <button class=knopka>
       <b>Купить сейчас за 4$ или за 359 руб.</b>
       </button>
  </a>
</div>



<div class="JOPA">
  <img class="kartinka" src="https://www.digiseller.ru/preview/118855/p1_2617160_c68e8bc7.jpg">
  <b>  <br> 1.Стоимость продукта=338руб или 4$<br> 2.Жанр-Сурваивел хоррор<br>3.Название продукта-Dying Light-Enhanced Edition РУ/СНГ Ключ Оригинал<Br>                                                                                                 </b>

  <A href="https://plati.market/itm/dying-light-enhanced-edition-key-ru-cis-wholesale/2617160" target="_blank">
    <button class="knopka">
Купить Dying Light-Enhanced Edition РУ/СНГ Ключ Оригинал!
            </button>
  </A>
</div>

Здраствуйте,я начанающий программист! Начал практироватся,написал сайт,проблема в том что граница border на весь экран.Да ответ можно картинкой.

Answer 1

border - это граница

.knopka:hover {
  background-color: rgb(85, 100, 79);
  font-size: 20px;
}

.kartinka {
  width: 350px;
  height: 250px;
}

.Game1 {
  margin-top: 20px;
  margin-left: 15px;
}

<div class="Game1">
  <img class="kartinka" src="https://www.digiseller.ru/preview/118855/p1_2369359_9784a101.jpg">
  <b> 
		<br> 1.Стоимость продукта=359 руб или 4$<br> 2.Жанр-Тактический шутер<br>3.Название продукта-Rainbow Six: Siege<br>
	</b>

  <a href="https://plati.market/itm/tom-clancys-rainbow-six-siege-standart-wholesale-key/2369359" target="_blank">
    <button class="knopka">
			<b>Купить сейчас за 4$ или за 359 руб.</b>
		</button>
  </a>
</div>



<div class="JOPA">
  <img class="kartinka" src="https://www.digiseller.ru/preview/118855/p1_2617160_c68e8bc7.jpg">
  <b>
		<br> 1.Стоимость продукта=338руб или 4$<br> 2.Жанр-Сурваивел хоррор<br>3.Название продукта-Dying Light-Enhanced Edition РУ/СНГ Ключ Оригинал<br>
	</b>

  <a href="https://plati.market/itm/dying-light-enhanced-edition-key-ru-cis-wholesale/2617160" target="_blank">
    <button class="knopka">
			Купить Dying Light-Enhanced Edition РУ/СНГ Ключ Оригинал!
		</button>
  </a>
</div>

Answer 2

.Game1 {
    margin-top: 20px;
    margin-left: 15px;
    border: 3px solid;
    display: inline-block;
}

Это если граница нужна у картинки с текстом

БЛОГ НА HUSL

Помогите со границами

Ответы (2 шт):