Показать сообщение отдельно
  #2 (permalink)  
Старый 09.08.2022, 13:41
Аватар для рони
Профессор
Отправить личное сообщение для рони Посмотреть профиль Найти все сообщения от рони
 
Регистрация: 27.05.2010
Сообщений: 33,121

Ivan65913,
может так ...
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<!-- Bootstrap 5 CSS -->
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.0.1/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-+0n0xVW2eSR5OomGNYDnhzAbDsOXxcvSN1TPprVMTNDbiYZCxYbOOl7+AMvyTG2x" crossorigin="anonymous">
<style type="text/css">
.row img{
    margin: 0px;  padding: 0px;
}
</style>
</head>
<!-- body --- --- --- --- --- --- --- --- --- -->
<body>
<div class="container-fluid bg-primary">
  <div class="row bg-primary">
    <!-- Col-1 === === === === === === === === === === === -->
    <div class="col bg-danger sidebar">
          Column-Left
          <div class="row ">
            <div class="col-5 block">
                <h2>Наименование </h2>
                <h5>Описание объекта</h5>
            </div>
          </div>
          <hr/>
          <!-- hr -- --- --- --  -->

          <div class="row ">
          <!-- hr   <div class="d-grid gap-2 col-6 mx-auto"> -->
          <div class="d-grid gap-2 col-6 mx-auto">
              <button class="btn btn-primary" type="button">Кнопка-1. Описание</button>
              <button class="btn btn-primary" type="button">Кнопка-2. Описание длинное, длинное </button>
              <button class="btn btn-primary" type="button">Кнопка-3. Описание</button>
          </div>
          </div>
          <hr/>
          <!-- hr -- --- --- --  -->
            <div class="row">
            <p>
            Строка-1. Текст Текст Текст Текст Текст Текст  Текст Текст Текст  Текст Текст Текст <br>
            Строка-2. Текст Текст Текст Текст Текст Текст  Текст Текст Текст  Текст Текст Текст <br>
            Строка-3. Текст Текст Текст Текст Текст Текст  Текст Текст Текст  Текст Текст Текст <br>
            Строка-4. Текст Текст Текст Текст Текст Текст  Текст Текст Текст  Текст Текст Текст <br>
            Строка-5. Текст Текст Текст Текст Текст Текст  Текст Текст Текст  Текст Текст Текст <br>
            Строка-6. Текст Текст Текст Текст Текст Текст  Текст Текст Текст  Текст Текст Текст <br>
            Строка-7. Текст Текст Текст Текст Текст Текст  Текст Текст Текст  Текст Текст Текст <br>
            Строка-8. Текст Текст Текст Текст Текст Текст  Текст Текст Текст  Текст Текст Текст <br>
            Строка-9. Текст Текст Текст Текст Текст Текст  Текст Текст Текст  Текст Текст Текст <br>
            Строка-10. Текст Текст Текст Текст Текст Текст  Текст Текст Текст  Текст Текст Текст <br>

            </p>
            </div>
     </div>
     <!-- Col-1.END === === === === === === === === === === ===  -->
     <!-- Col-2.  === === === === === === === === === === === -->
    <div class="col-4 bg-warning sidebar">
      Center
      <div class="row bg-danger">
      <img src="https://i.ibb.co/dPK2kMF/img694.jpg" class="img-fluid" >
      </div>

      <div class="row bg-success">
      <img src="https://i.ibb.co/4pgSRDf/0020.jpg" class="img-fluid">
      </div>

    </div>
    <!-- Col-2.END  === === === === === === === === === === === -->
    <!-- Col-3.   === === === === === === === === === === === -->
    <div class="col-4 bg-success sidebar">
      Right
        <div class="row bg-danger">
          <img src="https://i.ibb.co/99751Fv/0021.jpg" class="img-fluid" >
      </div>

      <div class="row bg-success">
      <img src="https://i.ibb.co/L6npzVL/0023.jpg" class="img-responsive" >
      </div>

    </div>
    <!-- Col-3.END.=== === === === === === === === === === === -->
  </div>
 </div>
<!-- Bootstrap 5 Scripts -->
<!-- script --- --- --- --- --- --- --- --- --- -->
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.0.1/dist/js/bootstrap.bundle.min.js" integrity="sha384-gtEjrD/SeCtmISkJkNUaaKMoLD0//ElJ19smozuHV6z3Iehds+3Ulb9Bn9Plx0x4" crossorigin="anonymous"></script>
<!-- script.END --- --- --- --- --- --- --- --- --- -->
</body>
<!-- body.END --- --- --- --- --- --- --- --- --- -->
</html>
Ответить с цитированием