Skip to main content
Reversão para edição 4
Fonte Link
Jéf Bueno
  • 69,8mil
  • 22
  • 134
  • 244

A sua ajuda foi muito boa se eu fizer isso de modo simples, masComo é que ao fazer como aqui em baixo já não funciona. Repare em baixo, os logótipos do lado direitoinserir elementos na coluna da esquerda isso não deviam ter espaços;afecta a altura das linhas da coluna da direita; ou seja, deviam estar unscomo faço duas colunas totalmente independentes para que ao inserir elementos numa coluna isso não afecte em nada a seguir aos outros.outra?

PodeSe eu inserir uma imagem na coluna da esquerda (neste caso o logo_blank.png), a imagem da bicicleta (product1), que está na coluna da direita, move-me ajudarse para baixo. Ora, como fazer para que a descobrirbicicleta não se mova ela tem de ficar onde está o erro?

   <!DOCTYPE html>
<html>
   <head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">

<!-- CSS -->
<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.1.2/css/bootstrap.min.css" integrity="sha384-Smlep5jCw/wG7hdkwQ/Z5nLIefveQRIY9nfy6xoR1uRYBtpZgI6339F5dgvm/e9B" crossorigin="anonymous">
<link href="./css/lotti.css" rel="stylesheet" type="text/css">

<title>Tombola Dinamica</title>

  <!-- Custom fonts for this template -->
  <link href="./b_styles/vendor/font-awesome/css/font-awesome.min.css" rel="stylesheet" type="text/css">
  <!--[if lt IE 7]>
  <style type="text/css">
     img { behavior: url("pngfix.htc"); }
  </style>
  <![endif]-->
   </head>
<body scroll="no" style="overflow: auto">
<header class="image-background">
  <div class="container">
     <div class="row mx-md-n5">
         
       <div class="col-md-7">

<img id="logo" src="./img/outras/logo_blank.png" class="rounded float-left logo" alt="...">  <div class="col-md-7">
            
 <img id="logo" src="./img/outras/logo_blank.png" class="rounded float-left logo" alt="...">                   
               </div>    
               </div>
           <div class="col-md-5">
<img id="logo" src="./img/outras/logo_blank.png" class="rounded float-left logo" alt="..."> 
        </div>
     </div>
     
     <div class="row mt-3">
           <div class="col-md-7">
 
<!-- Marquee -->

<!-- Product Image -->               
<img id="image_produt" src="./img/outras</product1.jpg" style="width:340px; height:200px; margin-top:-7px; background: Transparent;div>
 margin: 5 auto; border: 10px double #ddd;" class="rounded<div floatclass="col-left logo" alt="...">  md-5">
           </div>
        <div class="col-md-5">
<img id="logo"id="apostSort" src="./img/outras/logo_blankproduct1.png"jpg" class="rounded float-left logo"left" alt="..."> 
        </div>
     </div>
     
     <div class="row mt-4">
           <div class="col-md-7">

   <!-- Texto da Campanha -->
<h1 style="color:#fff; font-family:colibri; font-size:170%; font-weight: normal; margin-left:0px; margin-top: 20px;"><b> xxxx xxxx </b>: </b></h1>

<h4 style="color:#fbaf20; margin-left:255px; margin-top:-38px">5</h4>
<h4 style="color:#fbaf20; margin-left:275px; margin-top:-36px">13</h4> 
<h4 style="color:#0ec51a; margin-left:310px; margin-top:-36px">9</h4>

<h1 style="color:#fff; font-family:colibri; font-size:120%; font-weight: normal; margin-top:-5px; margin-left:0px;">wefwefwefwefwef. <br> fwefwefwefwefwefef. <br> efwefwf!..</h1>

<h5 style="color:#fff; font-family:colibri; font-size:111%; margin-left: 0px; margin-top:15px;">sdfsdfdff + fsfsdf + fffsdfsdfs </h5>  


           </div>
        <div class="col-md-5">
   <img id="logo" src="./img/outras/logo_blank.png" class="rounded float-left logo" alt="...">  <div id="d4w4" >
               
           </div>
        </div>
     </div>
     <div class="row mt-4">
           <div class="col-md-7">
               
  

           </div>
        <div class="col-md-5 ">
      <img id="logo" src="./img/outras/logo_blank.png" class="rounded float-left logo" alt="..."><div id="d4w3"></div>
        </div>
     </div>
     <div class="row mt-1">
           <div class="col-md-7">
              
  
                     
           </div>
        <div class="col-md-5">
   
         <<div id="d4w2"></div>
     </div>
   </div>
  
    </div>
  </div>

<script src="https://code.jquery.com/jquery-3.3.1.slim.min.js" integrity="sha384-q8i/X+965DzO0rT7abK41JStQIAqVgRVzpbzo5smXKp4YfRvH+8abtTE1Pi6jizo" crossorigin="anonymous"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.3/umd/popper.min.js" integrity="sha384-ZMP7rVo3mIykV+2+9J3UJ46jBk0WLaUAdn689aCwoqbBJiSnjAK/l8WvCWPIPm49" crossorigin="anonymous"></script>
<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.1.2/js/bootstrap.min.js" integrity="sha384-o+RDsa0aLu++PJvFqy8fFScvbHFLtbvScb8AjopnFD+iEQ7wo/CG0xlczd+2O/em" crossorigin="anonymous"></script>
<script type="text/javascript" src="./js/LottiDynamic.js"></script> 
   </body>
</html>

A sua ajuda foi muito boa se eu fizer isso de modo simples, mas ao fazer como aqui em baixo já não funciona. Repare em baixo, os logótipos do lado direito não deviam ter espaços; ou seja, deviam estar uns a seguir aos outros.

Pode-me ajudar a descobrir onde está o erro?

   !DOCTYPE html>
<html>
   <head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">

<!-- CSS -->
<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.1.2/css/bootstrap.min.css" integrity="sha384-Smlep5jCw/wG7hdkwQ/Z5nLIefveQRIY9nfy6xoR1uRYBtpZgI6339F5dgvm/e9B" crossorigin="anonymous">
<link href="./css/lotti.css" rel="stylesheet" type="text/css">

<title>Tombola Dinamica</title>

  <!-- Custom fonts for this template -->
  <link href="./b_styles/vendor/font-awesome/css/font-awesome.min.css" rel="stylesheet" type="text/css">
  <!--[if lt IE 7]>
  <style type="text/css">
     img { behavior: url("pngfix.htc"); }
  </style>
  <![endif]-->
   </head>
<body scroll="no" style="overflow: auto">
<header class="image-background">
  <div class="container">
     <div class="row mx-md-n5">
         
                <div class="col-md-7">
          <img id="logo" src="./img/outras/logo_blank.png" class="rounded float-left logo" alt="...">          
               </div>
               
           <div class="col-md-5">
<img id="logo" src="./img/outras/logo_blank.png" class="rounded float-left logo" alt="..."> 
        </div>
     </div>
     
     <div class="row mt-3">
           <div class="col-md-7">
 
<!-- Marquee -->

<!-- Product Image -->               
<img id="image_produt" src="./img/outras/product1.jpg" style="width:340px; height:200px; margin-top:-7px; background: Transparent; margin: 5 auto; border: 10px double #ddd;" class="rounded float-left logo" alt="...">  
           </div>
        <div class="col-md-5">
<img id="logo" src="./img/outras/logo_blank.png" class="rounded float-left logo" alt="..."> 
        </div>
     </div>
     
     <div class="row mt-4">
           <div class="col-md-7">

   <!-- Texto da Campanha -->
<h1 style="color:#fff; font-family:colibri; font-size:170%; font-weight: normal; margin-left:0px; margin-top: 20px;"><b> xxxx xxxx </b>: </b></h1>

<h4 style="color:#fbaf20; margin-left:255px; margin-top:-38px">5</h4>
<h4 style="color:#fbaf20; margin-left:275px; margin-top:-36px">13</h4> 
<h4 style="color:#0ec51a; margin-left:310px; margin-top:-36px">9</h4>

<h1 style="color:#fff; font-family:colibri; font-size:120%; font-weight: normal; margin-top:-5px; margin-left:0px;">wefwefwefwefwef. <br> fwefwefwefwefwefef. <br> efwefwf!..</h1>

<h5 style="color:#fff; font-family:colibri; font-size:111%; margin-left: 0px; margin-top:15px;">sdfsdfdff + fsfsdf + fffsdfsdfs </h5>  


           </div>
        <div class="col-md-5">
   <img id="logo" src="./img/outras/logo_blank.png" class="rounded float-left logo" alt="..."> 
               
           </div>
        </div>
     </div>
     <div class="row mt-4">
           <div class="col-md-7">
               
  

           </div>
        <div class="col-md-5 ">
      <img id="logo" src="./img/outras/logo_blank.png" class="rounded float-left logo" alt="..."> 
        </div>
     </div>
     <div class="row mt-1">
           <div class="col-md-7">
               
                     
           </div>
        <div class="col-md-5">
   
         </div>
     </div>
  </div>
  
   
  
<script src="https://code.jquery.com/jquery-3.3.1.slim.min.js" integrity="sha384-q8i/X+965DzO0rT7abK41JStQIAqVgRVzpbzo5smXKp4YfRvH+8abtTE1Pi6jizo" crossorigin="anonymous"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.3/umd/popper.min.js" integrity="sha384-ZMP7rVo3mIykV+2+9J3UJ46jBk0WLaUAdn689aCwoqbBJiSnjAK/l8WvCWPIPm49" crossorigin="anonymous"></script>
<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.1.2/js/bootstrap.min.js" integrity="sha384-o+RDsa0aLu++PJvFqy8fFScvbHFLtbvScb8AjopnFD+iEQ7wo/CG0xlczd+2O/em" crossorigin="anonymous"></script>
<script type="text/javascript" src="./js/LottiDynamic.js"></script>
   </body>
</html>

Como é que ao inserir elementos na coluna da esquerda isso não afecta a altura das linhas da coluna da direita; ou seja, como faço duas colunas totalmente independentes para que ao inserir elementos numa coluna isso não afecte em nada a outra?

Se eu inserir uma imagem na coluna da esquerda (neste caso o logo_blank.png), a imagem da bicicleta (product1), que está na coluna da direita, move-se para baixo. Ora, como fazer para que a bicicleta não se mova ela tem de ficar onde está?

<!DOCTYPE html>
<html>
   <head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">

<!-- CSS -->
<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.1.2/css/bootstrap.min.css" integrity="sha384-Smlep5jCw/wG7hdkwQ/Z5nLIefveQRIY9nfy6xoR1uRYBtpZgI6339F5dgvm/e9B" crossorigin="anonymous">
<link href="./css/lotti.css" rel="stylesheet" type="text/css">

<title>Tombola Dinamica</title>

  <!-- Custom fonts for this template -->
  <link href="./b_styles/vendor/font-awesome/css/font-awesome.min.css" rel="stylesheet" type="text/css">
  <!--[if lt IE 7]>
  <style type="text/css">
     img { behavior: url("pngfix.htc"); }
  </style>
  <![endif]-->
   </head>
<body scroll="no" style="overflow: auto">
<header class="image-background">
  <div class="container">
     <div class="row mx-md-n5">
               <div class="col-md-7">

<img id="logo" src="./img/outras/logo_blank.png" class="rounded float-left logo" alt="...">   
            
 <img id="logo" src="./img/outras/logo_blank.png" class="rounded float-left logo" alt="...">                   
                   
               </div>
           <div class="col-md-5">

        </div>
     </div>
     <div class="row mt-3">
           <div class="col-md-7">
 

           </div>
        <div class="col-md-5">
            <img id="apostSort" src="./img/outras/product1.jpg" class="rounded float-left" alt="...">
        </div>
     </div>
     <div class="row mt-4">
           <div class="col-md-7">


           </div>
        <div class="col-md-5">
           <div id="d4w4" >
               
           </div>
        </div>
     </div>
     <div class="row mt-4">
           <div class="col-md-7">
 

           </div>
        <div class="col-md-5 ">
           <div id="d4w3"></div>
        </div>
     </div>
     <div class="row mt-1">
           <div class="col-md-7">
 
                      
           </div>
        <div class="col-md-5">
           <div id="d4w2"></div>
        </div>
     </div>
  </div>

<script src="https://code.jquery.com/jquery-3.3.1.slim.min.js" integrity="sha384-q8i/X+965DzO0rT7abK41JStQIAqVgRVzpbzo5smXKp4YfRvH+8abtTE1Pi6jizo" crossorigin="anonymous"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.3/umd/popper.min.js" integrity="sha384-ZMP7rVo3mIykV+2+9J3UJ46jBk0WLaUAdn689aCwoqbBJiSnjAK/l8WvCWPIPm49" crossorigin="anonymous"></script>
<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.1.2/js/bootstrap.min.js" integrity="sha384-o+RDsa0aLu++PJvFqy8fFScvbHFLtbvScb8AjopnFD+iEQ7wo/CG0xlczd+2O/em" crossorigin="anonymous"></script>
   
   </body>
</html>
removeu 433 caracteres do conteúdo
Fonte Link
user110243
user110243

Como é que ao inserir elementos na coluna da esquerdaA sua ajuda foi muito boa se eu fizer isso não afecta a altura das linhas da coluna da direita; ou sejade modo simples, como faço duas colunas totalmente independentes para quemas ao inserir elementos numa coluna issofazer como aqui em baixo já não afectefunciona. Repare em nadabaixo, os logótipos do lado direito não deviam ter espaços; ou seja, deviam estar uns a outra?seguir aos outros.

Se eu inserir uma imagem na coluna da esquerda (neste caso o logo_blank.png), a imagem da bicicleta (product1), que está na coluna da direita, movePode-se para baixo. Ora, como fazer para queme ajudar a bicicleta não se mova ela tem de ficardescobrir onde está o erro?

<   !DOCTYPE html>
<html>
   <head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">

<!-- CSS -->
<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.1.2/css/bootstrap.min.css" integrity="sha384-Smlep5jCw/wG7hdkwQ/Z5nLIefveQRIY9nfy6xoR1uRYBtpZgI6339F5dgvm/e9B" crossorigin="anonymous">
<link href="./css/lotti.css" rel="stylesheet" type="text/css">

<title>Tombola Dinamica</title>

  <!-- Custom fonts for this template -->
  <link href="./b_styles/vendor/font-awesome/css/font-awesome.min.css" rel="stylesheet" type="text/css">
  <!--[if lt IE 7]>
  <style type="text/css">
     img { behavior: url("pngfix.htc"); }
  </style>
  <![endif]-->
   </head>
<body scroll="no" style="overflow: auto">
<header class="image-background">
  <div class="container">
     <div class="row mx-md-n5">
          
      <div class="col-md-7">

<img id="logo" src="./img/outras/logo_blank.png" class="rounded float-left logo" alt="...">  <div class="col-md-7">
           
  <img id="logo" src="./img/outras/logo_blank.png" class="rounded float-left logo" alt="...">                   
                   </div>
               </div>
           <div class="col-md-5">
<img id="logo" src="./img/outras/logo_blank.png" class="rounded float-left logo" alt="..."> 
        </div>
     </div>
     
     <div class="row mt-3">
           <div class="col-md-7">
 
<!-- Marquee -->

<!-- Product Image -->        </div>
       
<img <divid="image_produt" class="colsrc="./img/outras/product1.jpg" style="width:340px; height:200px; margin-mdtop:-5">7px; background: Transparent; margin: 5 auto; border: 10px double #ddd;" class="rounded float-left logo" alt="...">  
           </div>
        <div class="col-md-5">
<img id="apostSort"id="logo" src="./img/outras/product1logo_blank.jpg"png" class="rounded float-left"left logo" alt="..."> 
        </div>
     </div>
     
     <div class="row mt-4">
           <div class="col-md-7">

   <!-- Texto da Campanha -->
<h1 style="color:#fff; font-family:colibri; font-size:170%; font-weight: normal; margin-left:0px; margin-top: 20px;"><b> xxxx xxxx </b>: </b></h1>

<h4 style="color:#fbaf20; margin-left:255px; margin-top:-38px">5</h4>
<h4 style="color:#fbaf20; margin-left:275px; margin-top:-36px">13</h4> 
<h4 style="color:#0ec51a; margin-left:310px; margin-top:-36px">9</h4>

<h1 style="color:#fff; font-family:colibri; font-size:120%; font-weight: normal; margin-top:-5px; margin-left:0px;">wefwefwefwefwef. <br> fwefwefwefwefwefef. <br> efwefwf!..</h1>

<h5 style="color:#fff; font-family:colibri; font-size:111%; margin-left: 0px; margin-top:15px;">sdfsdfdff + fsfsdf + fffsdfsdfs </h5>  


           </div>
        <div class="col-md-5">
      <img id="logo" src="./img/outras/logo_blank.png" class="rounded float-left <divlogo" id="d4w4"alt="..."> >
               
           </div>
        </div>
     </div>
     <div class="row mt-4">
           <div class="col-md-7">
               
  

           </div>
        <div class="col-md-5 ">
      <img id="logo" src="./img/outras/logo_blank.png" class="rounded float-left <divlogo" id="d4w3"></div>alt="..."> 
        </div>
     </div>
     <div class="row mt-1">
           <div class="col-md-7">
 
               
                    
           </div>
        <div class="col-md-5">
     
       <div id="d4w2"><</div>
        </div>
     </div>
  </div>
  
  
<script src="https://code.jquery.com/jquery-3.3.1.slim.min.js" integrity="sha384-q8i/X+965DzO0rT7abK41JStQIAqVgRVzpbzo5smXKp4YfRvH+8abtTE1Pi6jizo" crossorigin="anonymous"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.3/umd/popper.min.js" integrity="sha384-ZMP7rVo3mIykV+2+9J3UJ46jBk0WLaUAdn689aCwoqbBJiSnjAK/l8WvCWPIPm49" crossorigin="anonymous"></script>
<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.1.2/js/bootstrap.min.js" integrity="sha384-o+RDsa0aLu++PJvFqy8fFScvbHFLtbvScb8AjopnFD+iEQ7wo/CG0xlczd+2O/em" crossorigin="anonymous"></script>
 <script type="text/javascript" src="./js/LottiDynamic.js"></script>
   </body>
</html>

Como é que ao inserir elementos na coluna da esquerda isso não afecta a altura das linhas da coluna da direita; ou seja, como faço duas colunas totalmente independentes para que ao inserir elementos numa coluna isso não afecte em nada a outra?

Se eu inserir uma imagem na coluna da esquerda (neste caso o logo_blank.png), a imagem da bicicleta (product1), que está na coluna da direita, move-se para baixo. Ora, como fazer para que a bicicleta não se mova ela tem de ficar onde está?

<!DOCTYPE html>
<html>
   <head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">

<!-- CSS -->
<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.1.2/css/bootstrap.min.css" integrity="sha384-Smlep5jCw/wG7hdkwQ/Z5nLIefveQRIY9nfy6xoR1uRYBtpZgI6339F5dgvm/e9B" crossorigin="anonymous">
<link href="./css/lotti.css" rel="stylesheet" type="text/css">

<title>Tombola Dinamica</title>

  <!-- Custom fonts for this template -->
  <link href="./b_styles/vendor/font-awesome/css/font-awesome.min.css" rel="stylesheet" type="text/css">
  <!--[if lt IE 7]>
  <style type="text/css">
     img { behavior: url("pngfix.htc"); }
  </style>
  <![endif]-->
   </head>
<body scroll="no" style="overflow: auto">
<header class="image-background">
  <div class="container">
     <div class="row mx-md-n5">
               <div class="col-md-7">

<img id="logo" src="./img/outras/logo_blank.png" class="rounded float-left logo" alt="...">   
           
  <img id="logo" src="./img/outras/logo_blank.png" class="rounded float-left logo" alt="...">                   
                   
               </div>
           <div class="col-md-5">

        </div>
     </div>
     <div class="row mt-3">
           <div class="col-md-7">
 

           </div>
        <div class="col-md-5">
            <img id="apostSort" src="./img/outras/product1.jpg" class="rounded float-left" alt="...">
        </div>
     </div>
     <div class="row mt-4">
           <div class="col-md-7">


           </div>
        <div class="col-md-5">
           <div id="d4w4" >
               
           </div>
        </div>
     </div>
     <div class="row mt-4">
           <div class="col-md-7">
 

           </div>
        <div class="col-md-5 ">
           <div id="d4w3"></div>
        </div>
     </div>
     <div class="row mt-1">
           <div class="col-md-7">
 
                      
           </div>
        <div class="col-md-5">
           <div id="d4w2"></div>
        </div>
     </div>
  </div>

<script src="https://code.jquery.com/jquery-3.3.1.slim.min.js" integrity="sha384-q8i/X+965DzO0rT7abK41JStQIAqVgRVzpbzo5smXKp4YfRvH+8abtTE1Pi6jizo" crossorigin="anonymous"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.3/umd/popper.min.js" integrity="sha384-ZMP7rVo3mIykV+2+9J3UJ46jBk0WLaUAdn689aCwoqbBJiSnjAK/l8WvCWPIPm49" crossorigin="anonymous"></script>
<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.1.2/js/bootstrap.min.js" integrity="sha384-o+RDsa0aLu++PJvFqy8fFScvbHFLtbvScb8AjopnFD+iEQ7wo/CG0xlczd+2O/em" crossorigin="anonymous"></script>
   
   </body>
</html>

A sua ajuda foi muito boa se eu fizer isso de modo simples, mas ao fazer como aqui em baixo já não funciona. Repare em baixo, os logótipos do lado direito não deviam ter espaços; ou seja, deviam estar uns a seguir aos outros.

Pode-me ajudar a descobrir onde está o erro?

   !DOCTYPE html>
<html>
   <head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">

<!-- CSS -->
<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.1.2/css/bootstrap.min.css" integrity="sha384-Smlep5jCw/wG7hdkwQ/Z5nLIefveQRIY9nfy6xoR1uRYBtpZgI6339F5dgvm/e9B" crossorigin="anonymous">
<link href="./css/lotti.css" rel="stylesheet" type="text/css">

<title>Tombola Dinamica</title>

  <!-- Custom fonts for this template -->
  <link href="./b_styles/vendor/font-awesome/css/font-awesome.min.css" rel="stylesheet" type="text/css">
  <!--[if lt IE 7]>
  <style type="text/css">
     img { behavior: url("pngfix.htc"); }
  </style>
  <![endif]-->
   </head>
<body scroll="no" style="overflow: auto">
<header class="image-background">
  <div class="container">
     <div class="row mx-md-n5">
          
               <div class="col-md-7">
          <img id="logo" src="./img/outras/logo_blank.png" class="rounded float-left logo" alt="...">          
               </div>
               
           <div class="col-md-5">
<img id="logo" src="./img/outras/logo_blank.png" class="rounded float-left logo" alt="..."> 
        </div>
     </div>
     
     <div class="row mt-3">
           <div class="col-md-7">
 
<!-- Marquee -->

<!-- Product Image -->               
<img id="image_produt" src="./img/outras/product1.jpg" style="width:340px; height:200px; margin-top:-7px; background: Transparent; margin: 5 auto; border: 10px double #ddd;" class="rounded float-left logo" alt="...">  
           </div>
        <div class="col-md-5">
<img id="logo" src="./img/outras/logo_blank.png" class="rounded float-left logo" alt="..."> 
        </div>
     </div>
     
     <div class="row mt-4">
           <div class="col-md-7">

   <!-- Texto da Campanha -->
<h1 style="color:#fff; font-family:colibri; font-size:170%; font-weight: normal; margin-left:0px; margin-top: 20px;"><b> xxxx xxxx </b>: </b></h1>

<h4 style="color:#fbaf20; margin-left:255px; margin-top:-38px">5</h4>
<h4 style="color:#fbaf20; margin-left:275px; margin-top:-36px">13</h4> 
<h4 style="color:#0ec51a; margin-left:310px; margin-top:-36px">9</h4>

<h1 style="color:#fff; font-family:colibri; font-size:120%; font-weight: normal; margin-top:-5px; margin-left:0px;">wefwefwefwefwef. <br> fwefwefwefwefwefef. <br> efwefwf!..</h1>

<h5 style="color:#fff; font-family:colibri; font-size:111%; margin-left: 0px; margin-top:15px;">sdfsdfdff + fsfsdf + fffsdfsdfs </h5>  


           </div>
        <div class="col-md-5">
   <img id="logo" src="./img/outras/logo_blank.png" class="rounded float-left logo" alt="..."> 
               
           </div>
        </div>
     </div>
     <div class="row mt-4">
           <div class="col-md-7">
               
  

           </div>
        <div class="col-md-5 ">
      <img id="logo" src="./img/outras/logo_blank.png" class="rounded float-left logo" alt="..."> 
        </div>
     </div>
     <div class="row mt-1">
           <div class="col-md-7">
               
                    
           </div>
        <div class="col-md-5">
    
        </div>
     </div>
  </div>
  
  
  
<script src="https://code.jquery.com/jquery-3.3.1.slim.min.js" integrity="sha384-q8i/X+965DzO0rT7abK41JStQIAqVgRVzpbzo5smXKp4YfRvH+8abtTE1Pi6jizo" crossorigin="anonymous"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.3/umd/popper.min.js" integrity="sha384-ZMP7rVo3mIykV+2+9J3UJ46jBk0WLaUAdn689aCwoqbBJiSnjAK/l8WvCWPIPm49" crossorigin="anonymous"></script>
<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.1.2/js/bootstrap.min.js" integrity="sha384-o+RDsa0aLu++PJvFqy8fFScvbHFLtbvScb8AjopnFD+iEQ7wo/CG0xlczd+2O/em" crossorigin="anonymous"></script>
<script type="text/javascript" src="./js/LottiDynamic.js"></script>
   </body>
</html>
removeu 20 caracteres do conteúdo
Fonte Link
user110243
user110243
<!DOCTYPE html>
<html>
   <head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">

<!-- CSS -->
<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.1.2/css/bootstrap.min.css" integrity="sha384-Smlep5jCw/wG7hdkwQ/Z5nLIefveQRIY9nfy6xoR1uRYBtpZgI6339F5dgvm/e9B" crossorigin="anonymous">
<link href="./css/lotti.css" rel="stylesheet" type="text/css">

<title>Tombola Dinamica</title>

  <!-- Custom fonts for this template -->
  <link href="http://clubesortehref=".org/b_styles/vendor/font-awesome/css/font-awesome.min.css" rel="stylesheet" type="text/css">
  <!--[if lt IE 7]>
  <style type="text/css">
     img { behavior: url("pngfix.htc"); }
  </style>
  <![endif]-->
   </head>
<body scroll="no" style="overflow: auto">
<header class="image-background">
  <div class="container">
     <div class="row mx-md-n5">
               <div class="col-md-7">

<img id="logo" src="./img/outras/logo_blank.png" class="rounded float-left logo" alt="...">   
           
 <img id="logo" src="./img/outras/logo_blank.png" class="rounded float-left logo" alt="...">                   
                   
               </div>
           <div class="col-md-5">

        </div>
     </div>
     <div class="row mt-3">
           <div class="col-md-7">
 

           </div>
        <div class="col-md-5">
            <img id="apostSort" src="./img/outras/product1.jpg" class="rounded float-left" alt="...">
        </div>
     </div>
     <div class="row mt-4">
           <div class="col-md-7">


           </div>
        <div class="col-md-5">
           <div id="d4w4" >
               
           </div>
        </div>
     </div>
     <div class="row mt-4">
           <div class="col-md-7">
 

           </div>
        <div class="col-md-5 ">
           <div id="d4w3"></div>
        </div>
     </div>
     <div class="row mt-1">
           <div class="col-md-7">

                      
           </div>
        <div class="col-md-5">
           <div id="d4w2"></div>
        </div>
     </div>
  </div>

<script src="https://code.jquery.com/jquery-3.3.1.slim.min.js" integrity="sha384-q8i/X+965DzO0rT7abK41JStQIAqVgRVzpbzo5smXKp4YfRvH+8abtTE1Pi6jizo" crossorigin="anonymous"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.3/umd/popper.min.js" integrity="sha384-ZMP7rVo3mIykV+2+9J3UJ46jBk0WLaUAdn689aCwoqbBJiSnjAK/l8WvCWPIPm49" crossorigin="anonymous"></script>
<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.1.2/js/bootstrap.min.js" integrity="sha384-o+RDsa0aLu++PJvFqy8fFScvbHFLtbvScb8AjopnFD+iEQ7wo/CG0xlczd+2O/em" crossorigin="anonymous"></script>
   
   </body>
</html>
<!DOCTYPE html>
<html>
   <head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">

<!-- CSS -->
<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.1.2/css/bootstrap.min.css" integrity="sha384-Smlep5jCw/wG7hdkwQ/Z5nLIefveQRIY9nfy6xoR1uRYBtpZgI6339F5dgvm/e9B" crossorigin="anonymous">
<link href="./css/lotti.css" rel="stylesheet" type="text/css">

<title>Tombola Dinamica</title>

  <!-- Custom fonts for this template -->
  <link href="http://clubesorte.org/b_styles/vendor/font-awesome/css/font-awesome.min.css" rel="stylesheet" type="text/css">
  <!--[if lt IE 7]>
  <style type="text/css">
     img { behavior: url("pngfix.htc"); }
  </style>
  <![endif]-->
   </head>
<body scroll="no" style="overflow: auto">
<header class="image-background">
  <div class="container">
     <div class="row mx-md-n5">
               <div class="col-md-7">

<img id="logo" src="./img/outras/logo_blank.png" class="rounded float-left logo" alt="...">   
           
 <img id="logo" src="./img/outras/logo_blank.png" class="rounded float-left logo" alt="...">                   
                   
               </div>
           <div class="col-md-5">

        </div>
     </div>
     <div class="row mt-3">
           <div class="col-md-7">
 

           </div>
        <div class="col-md-5">
            <img id="apostSort" src="./img/outras/product1.jpg" class="rounded float-left" alt="...">
        </div>
     </div>
     <div class="row mt-4">
           <div class="col-md-7">


           </div>
        <div class="col-md-5">
           <div id="d4w4" >
               
           </div>
        </div>
     </div>
     <div class="row mt-4">
           <div class="col-md-7">
 

           </div>
        <div class="col-md-5 ">
           <div id="d4w3"></div>
        </div>
     </div>
     <div class="row mt-1">
           <div class="col-md-7">

                      
           </div>
        <div class="col-md-5">
           <div id="d4w2"></div>
        </div>
     </div>
  </div>

<script src="https://code.jquery.com/jquery-3.3.1.slim.min.js" integrity="sha384-q8i/X+965DzO0rT7abK41JStQIAqVgRVzpbzo5smXKp4YfRvH+8abtTE1Pi6jizo" crossorigin="anonymous"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.3/umd/popper.min.js" integrity="sha384-ZMP7rVo3mIykV+2+9J3UJ46jBk0WLaUAdn689aCwoqbBJiSnjAK/l8WvCWPIPm49" crossorigin="anonymous"></script>
<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.1.2/js/bootstrap.min.js" integrity="sha384-o+RDsa0aLu++PJvFqy8fFScvbHFLtbvScb8AjopnFD+iEQ7wo/CG0xlczd+2O/em" crossorigin="anonymous"></script>
   
   </body>
</html>
<!DOCTYPE html>
<html>
   <head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">

<!-- CSS -->
<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.1.2/css/bootstrap.min.css" integrity="sha384-Smlep5jCw/wG7hdkwQ/Z5nLIefveQRIY9nfy6xoR1uRYBtpZgI6339F5dgvm/e9B" crossorigin="anonymous">
<link href="./css/lotti.css" rel="stylesheet" type="text/css">

<title>Tombola Dinamica</title>

  <!-- Custom fonts for this template -->
  <link href="./b_styles/vendor/font-awesome/css/font-awesome.min.css" rel="stylesheet" type="text/css">
  <!--[if lt IE 7]>
  <style type="text/css">
     img { behavior: url("pngfix.htc"); }
  </style>
  <![endif]-->
   </head>
<body scroll="no" style="overflow: auto">
<header class="image-background">
  <div class="container">
     <div class="row mx-md-n5">
               <div class="col-md-7">

<img id="logo" src="./img/outras/logo_blank.png" class="rounded float-left logo" alt="...">   
           
 <img id="logo" src="./img/outras/logo_blank.png" class="rounded float-left logo" alt="...">                   
                   
               </div>
           <div class="col-md-5">

        </div>
     </div>
     <div class="row mt-3">
           <div class="col-md-7">
 

           </div>
        <div class="col-md-5">
            <img id="apostSort" src="./img/outras/product1.jpg" class="rounded float-left" alt="...">
        </div>
     </div>
     <div class="row mt-4">
           <div class="col-md-7">


           </div>
        <div class="col-md-5">
           <div id="d4w4" >
               
           </div>
        </div>
     </div>
     <div class="row mt-4">
           <div class="col-md-7">
 

           </div>
        <div class="col-md-5 ">
           <div id="d4w3"></div>
        </div>
     </div>
     <div class="row mt-1">
           <div class="col-md-7">

                      
           </div>
        <div class="col-md-5">
           <div id="d4w2"></div>
        </div>
     </div>
  </div>

<script src="https://code.jquery.com/jquery-3.3.1.slim.min.js" integrity="sha384-q8i/X+965DzO0rT7abK41JStQIAqVgRVzpbzo5smXKp4YfRvH+8abtTE1Pi6jizo" crossorigin="anonymous"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.3/umd/popper.min.js" integrity="sha384-ZMP7rVo3mIykV+2+9J3UJ46jBk0WLaUAdn689aCwoqbBJiSnjAK/l8WvCWPIPm49" crossorigin="anonymous"></script>
<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.1.2/js/bootstrap.min.js" integrity="sha384-o+RDsa0aLu++PJvFqy8fFScvbHFLtbvScb8AjopnFD+iEQ7wo/CG0xlczd+2O/em" crossorigin="anonymous"></script>
   
   </body>
</html>
[Edição removida durante o período de tolerância]
Fonte Link
user110243
user110243
Carregando
adicionou 1883 caracteres ao conteúdo
Fonte Link
user110243
user110243
Carregando
Fonte Link
user110243
user110243
Carregando