Skip to main content
adicionou 4961 caracteres ao conteúdo
Fonte Link
Tobias Mesquita
  • 23,1mil
  • 1
  • 32
  • 52
var frmNoticia = document.getElementById("frmNoticia");
var txtConteudo = document.getElementById("txtConteudo");
var btEnviar = document.getElementById("btEnviar");

btEnviar.addEventListener("click", function (event) {
  //adicionando o conteudo de txtConteudo ao frmNoticia.
  var frmData = new FormData(frmNoticia);  
  frmData.append("txtConteudo", txtConteudo.textContent);  
  
  //enviando formulario de forma assicrona
  var xmlHttp = new XMLHttpRequest();
  xmlHttp.open("POST", "minha URL");
  xmlHttp.onreadystatechange = function () { 
    //retorno do AJAX.
  };
  xmlHttp.send(frmData);
});
.tres-colunas {  
  -webkit-column-count: 3; /* Chrome, Safari, Opera */
  -moz-column-count: 3; /* Firefox */
  column-count: 3;
}

#txtConteudo {
  max.mimic-height: 100px;
  overflow:textarea auto;{
  -moz-appearance: textfield-multiline;
  -webkit-appearance: textarea;
  border: 1px solid gray;
  font: medium -moz-fixed;
  font: -webkit-small-control;
  padding: 2px;
  resize: both;
}

#txtConteudo {
  max-height: 100px;
  overflow: auto;
}
<form id="frmNoticia">
  <input id="hdfIdentificador" type="hidden" value="1" />
  <div>
    <label>
      Titulo:
      <input id="txtTitulo" type="Text" value="" />
    </label>
  </div>
  <div>
    <label>
      Conteudo:
      <div id="txtConteudo" class="tres-colunas"colunas mimic-textarea" contentEditable="true">
        <p>
          Lorem ipsum dolor sit amet, consectetur adipiscing elit. Quisque mattis efficitur libero, in facilisis libero bibendum eu. Ut pretium elit neque, eget luctus dolor porta quis. Aliquam viverra porttitor nibh, ut mattis urna euismod eget. Aliquam posuere rhoncus ligula, eu ornare risus. Vivamus imperdiet finibus metus eu porttitor. Vivamus sodales tortor ut gravida placerat. Vestibulum auctor, eros nec hendrerit vehicula, ligula felis iaculis ex, nec lobortis nisl purus nec justo. Cras venenatis nisi imperdiet massa volutpat, sed ultricies turpis venenatis.
        </p>
      </div>
    </label>
  </div>
  <div>
      <input id="btEnviar" type="button" value="Enviar" />
  </div>
</form>
var frmNoticia = document.getElementById("frmNoticia");
var txtConteudo = document.getElementById("txtConteudo");
var hdfConteudo = document.getElementById("hdfConteudo");

frmNoticia.addEventListener("submit", function (event) {
  //copiando o valor de div#txtConteudo para o input#hdfConteudo
  //desta forma, o que será enviado é hdfConteudo.
  hdfConteudo.value = txtConteudo.textContent;
});
.tres-colunas {  
  -webkit-column-count: 3; /* Chrome, Safari, Opera */
  -moz-column-count: 3; /* Firefox */
  column-count: 3;
}

#txtConteudo {
  max.mimic-height: 100px;
  overflow:textarea auto;{
  -moz-appearance: textfield-multiline;
  -webkit-appearance: textarea;
  border: 1px solid gray;
  font: medium -moz-fixed;
  font: -webkit-small-control;
  padding: 2px;
  resize: both;
}

#txtConteudo {
  max-height: 100px;
  overflow: auto;
}
<form id="frmNoticia">
  <input id="hdfIdentificador" type="hidden" value="1" />
  <input id="hdfConteudo" type="hidden" value="1" />
  <div>
    <label>
      Titulo:
      <input id="txtTitulo" type="Text" value="" />
    </label>
  </div>
  <div>
    <label>
      Conteudo:
      <div id="txtConteudo" class="tres-colunas"colunas mimic-textarea" contentEditable="true">
        <p>
          Lorem ipsum dolor sit amet, consectetur adipiscing elit. Quisque mattis efficitur libero, in facilisis libero bibendum eu. Ut pretium elit neque, eget luctus dolor porta quis. Aliquam viverra porttitor nibh, ut mattis urna euismod eget. Aliquam posuere rhoncus ligula, eu ornare risus. Vivamus imperdiet finibus metus eu porttitor. Vivamus sodales tortor ut gravida placerat. Vestibulum auctor, eros nec hendrerit vehicula, ligula felis iaculis ex, nec lobortis nisl purus nec justo. Cras venenatis nisi imperdiet massa volutpat, sed ultricies turpis venenatis.
        </p>
      </div>
    </label>
  </div>
  <div>
      <input id="btEnviar" type="submit" value="Enviar" />
  </div>
</form>
var frmNoticia = document.getElementById("frmNoticia");
var txtConteudo = document.getElementById("txtConteudo");
var btEnviar = document.getElementById("btEnviar");

btEnviar.addEventListener("click", function (event) {
  //adicionando o conteudo de txtConteudo ao frmNoticia.
  var frmData = new FormData(frmNoticia);  
  frmData.append("txtConteudo", txtConteudo.textContent);  
  
  //enviando formulario de forma assicrona
  var xmlHttp = new XMLHttpRequest();
  xmlHttp.open("POST", "minha URL");
  xmlHttp.onreadystatechange = function () { 
    //retorno do AJAX.
  };
  xmlHttp.send(frmData);
});
.tres-colunas {  
  -webkit-column-count: 3; /* Chrome, Safari, Opera */
  -moz-column-count: 3; /* Firefox */
  column-count: 3;
}

#txtConteudo {
  max-height: 100px;
  overflow: auto;
  -moz-appearance: textfield-multiline;
  -webkit-appearance: textarea;
  border: 1px solid gray;
  font: medium -moz-fixed;
  font: -webkit-small-control;
  padding: 2px;
  resize: both;
}
<form id="frmNoticia">
  <input id="hdfIdentificador" type="hidden" value="1" />
  <div>
    <label>
      Titulo:
      <input id="txtTitulo" type="Text" value="" />
    </label>
  </div>
  <div>
    <label>
      Conteudo:
      <div id="txtConteudo" class="tres-colunas" contentEditable="true">
        <p>
          Lorem ipsum dolor sit amet, consectetur adipiscing elit. Quisque mattis efficitur libero, in facilisis libero bibendum eu. Ut pretium elit neque, eget luctus dolor porta quis. Aliquam viverra porttitor nibh, ut mattis urna euismod eget. Aliquam posuere rhoncus ligula, eu ornare risus. Vivamus imperdiet finibus metus eu porttitor. Vivamus sodales tortor ut gravida placerat. Vestibulum auctor, eros nec hendrerit vehicula, ligula felis iaculis ex, nec lobortis nisl purus nec justo. Cras venenatis nisi imperdiet massa volutpat, sed ultricies turpis venenatis.
        </p>
      </div>
    </label>
  </div>
  <div>
      <input id="btEnviar" type="button" value="Enviar" />
  </div>
</form>
var frmNoticia = document.getElementById("frmNoticia");
var txtConteudo = document.getElementById("txtConteudo");
var hdfConteudo = document.getElementById("hdfConteudo");

frmNoticia.addEventListener("submit", function (event) {
  //copiando o valor de div#txtConteudo para o input#hdfConteudo
  //desta forma, o que será enviado é hdfConteudo.
  hdfConteudo.value = txtConteudo.textContent;
});
.tres-colunas {  
  -webkit-column-count: 3; /* Chrome, Safari, Opera */
  -moz-column-count: 3; /* Firefox */
  column-count: 3;
}

#txtConteudo {
  max-height: 100px;
  overflow: auto;
  -moz-appearance: textfield-multiline;
  -webkit-appearance: textarea;
  border: 1px solid gray;
  font: medium -moz-fixed;
  font: -webkit-small-control;
  padding: 2px;
  resize: both;
}
<form id="frmNoticia">
  <input id="hdfIdentificador" type="hidden" value="1" />
  <input id="hdfConteudo" type="hidden" value="1" />
  <div>
    <label>
      Titulo:
      <input id="txtTitulo" type="Text" value="" />
    </label>
  </div>
  <div>
    <label>
      Conteudo:
      <div id="txtConteudo" class="tres-colunas" contentEditable="true">
        <p>
          Lorem ipsum dolor sit amet, consectetur adipiscing elit. Quisque mattis efficitur libero, in facilisis libero bibendum eu. Ut pretium elit neque, eget luctus dolor porta quis. Aliquam viverra porttitor nibh, ut mattis urna euismod eget. Aliquam posuere rhoncus ligula, eu ornare risus. Vivamus imperdiet finibus metus eu porttitor. Vivamus sodales tortor ut gravida placerat. Vestibulum auctor, eros nec hendrerit vehicula, ligula felis iaculis ex, nec lobortis nisl purus nec justo. Cras venenatis nisi imperdiet massa volutpat, sed ultricies turpis venenatis.
        </p>
      </div>
    </label>
  </div>
  <div>
      <input id="btEnviar" type="submit" value="Enviar" />
  </div>
</form>
var frmNoticia = document.getElementById("frmNoticia");
var txtConteudo = document.getElementById("txtConteudo");
var btEnviar = document.getElementById("btEnviar");

btEnviar.addEventListener("click", function (event) {
  //adicionando o conteudo de txtConteudo ao frmNoticia.
  var frmData = new FormData(frmNoticia);  
  frmData.append("txtConteudo", txtConteudo.textContent);  
  
  //enviando formulario de forma assicrona
  var xmlHttp = new XMLHttpRequest();
  xmlHttp.open("POST", "minha URL");
  xmlHttp.onreadystatechange = function () { 
    //retorno do AJAX.
  };
  xmlHttp.send(frmData);
});
.tres-colunas {  
  -webkit-column-count: 3; /* Chrome, Safari, Opera */
  -moz-column-count: 3; /* Firefox */
  column-count: 3;
}

.mimic-textarea {
  -moz-appearance: textfield-multiline;
  -webkit-appearance: textarea;
  border: 1px solid gray;
  font: medium -moz-fixed;
  font: -webkit-small-control;
  padding: 2px;
  resize: both;
}

#txtConteudo {
  max-height: 100px;
  overflow: auto;
}
<form id="frmNoticia">
  <input id="hdfIdentificador" type="hidden" value="1" />
  <div>
    <label>
      Titulo:
      <input id="txtTitulo" type="Text" value="" />
    </label>
  </div>
  <div>
    <label>
      Conteudo:
      <div id="txtConteudo" class="tres-colunas mimic-textarea" contentEditable="true">
        <p>
          Lorem ipsum dolor sit amet, consectetur adipiscing elit. Quisque mattis efficitur libero, in facilisis libero bibendum eu. Ut pretium elit neque, eget luctus dolor porta quis. Aliquam viverra porttitor nibh, ut mattis urna euismod eget. Aliquam posuere rhoncus ligula, eu ornare risus. Vivamus imperdiet finibus metus eu porttitor. Vivamus sodales tortor ut gravida placerat. Vestibulum auctor, eros nec hendrerit vehicula, ligula felis iaculis ex, nec lobortis nisl purus nec justo. Cras venenatis nisi imperdiet massa volutpat, sed ultricies turpis venenatis.
        </p>
      </div>
    </label>
  </div>
  <div>
      <input id="btEnviar" type="button" value="Enviar" />
  </div>
</form>
var frmNoticia = document.getElementById("frmNoticia");
var txtConteudo = document.getElementById("txtConteudo");
var hdfConteudo = document.getElementById("hdfConteudo");

frmNoticia.addEventListener("submit", function (event) {
  //copiando o valor de div#txtConteudo para o input#hdfConteudo
  //desta forma, o que será enviado é hdfConteudo.
  hdfConteudo.value = txtConteudo.textContent;
});
.tres-colunas {  
  -webkit-column-count: 3; /* Chrome, Safari, Opera */
  -moz-column-count: 3; /* Firefox */
  column-count: 3;
}

.mimic-textarea {
  -moz-appearance: textfield-multiline;
  -webkit-appearance: textarea;
  border: 1px solid gray;
  font: medium -moz-fixed;
  font: -webkit-small-control;
  padding: 2px;
  resize: both;
}

#txtConteudo {
  max-height: 100px;
  overflow: auto;
}
<form id="frmNoticia">
  <input id="hdfIdentificador" type="hidden" value="1" />
  <input id="hdfConteudo" type="hidden" value="1" />
  <div>
    <label>
      Titulo:
      <input id="txtTitulo" type="Text" value="" />
    </label>
  </div>
  <div>
    <label>
      Conteudo:
      <div id="txtConteudo" class="tres-colunas mimic-textarea" contentEditable="true">
        <p>
          Lorem ipsum dolor sit amet, consectetur adipiscing elit. Quisque mattis efficitur libero, in facilisis libero bibendum eu. Ut pretium elit neque, eget luctus dolor porta quis. Aliquam viverra porttitor nibh, ut mattis urna euismod eget. Aliquam posuere rhoncus ligula, eu ornare risus. Vivamus imperdiet finibus metus eu porttitor. Vivamus sodales tortor ut gravida placerat. Vestibulum auctor, eros nec hendrerit vehicula, ligula felis iaculis ex, nec lobortis nisl purus nec justo. Cras venenatis nisi imperdiet massa volutpat, sed ultricies turpis venenatis.
        </p>
      </div>
    </label>
  </div>
  <div>
      <input id="btEnviar" type="submit" value="Enviar" />
  </div>
</form>
adicionou 4961 caracteres ao conteúdo
Fonte Link
Tobias Mesquita
  • 23,1mil
  • 1
  • 32
  • 52

Agora para enviar o conteúdo da DIV, você irá precisar incluir o conteudo no Form.

Segue abaixo duas sugestões, uma assincronia e outra síncrona.

Assíncrona

var frmNoticia = document.getElementById("frmNoticia");
var txtConteudo = document.getElementById("txtConteudo");
var btEnviar = document.getElementById("btEnviar");

btEnviar.addEventListener("click", function (event) {
  //adicionando o conteudo de txtConteudo ao frmNoticia.
  var frmData = new FormData(frmNoticia);  
  frmData.append("txtConteudo", txtConteudo.textContent);  
  
  //enviando formulario de forma assicrona
  var xmlHttp = new XMLHttpRequest();
  xmlHttp.open("POST", "minha URL");
  xmlHttp.onreadystatechange = function () { 
    //retorno do AJAX.
  };
  xmlHttp.send(frmData);
});
.tres-colunas {  
  -webkit-column-count: 3; /* Chrome, Safari, Opera */
  -moz-column-count: 3; /* Firefox */
  column-count: 3;
}

#txtConteudo {
  max-height: 100px;
  overflow: auto;
  -moz-appearance: textfield-multiline;
  -webkit-appearance: textarea;
  border: 1px solid gray;
  font: medium -moz-fixed;
  font: -webkit-small-control;
  padding: 2px;
  resize: both;
}
<form id="frmNoticia">
  <input id="hdfIdentificador" type="hidden" value="1" />
  <div>
    <label>
      Titulo:
      <input id="txtTitulo" type="Text" value="" />
    </label>
  </div>
  <div>
    <label>
      Conteudo:
      <div id="txtConteudo" class="tres-colunas" contentEditable="true">
        <p>
          Lorem ipsum dolor sit amet, consectetur adipiscing elit. Quisque mattis efficitur libero, in facilisis libero bibendum eu. Ut pretium elit neque, eget luctus dolor porta quis. Aliquam viverra porttitor nibh, ut mattis urna euismod eget. Aliquam posuere rhoncus ligula, eu ornare risus. Vivamus imperdiet finibus metus eu porttitor. Vivamus sodales tortor ut gravida placerat. Vestibulum auctor, eros nec hendrerit vehicula, ligula felis iaculis ex, nec lobortis nisl purus nec justo. Cras venenatis nisi imperdiet massa volutpat, sed ultricies turpis venenatis.
        </p>
      </div>
    </label>
  </div>
  <div>
      <input id="btEnviar" type="button" value="Enviar" />
  </div>
</form>

Sincrona

Neste caso você só precisa copiar o conteúdo da div para um hidden antes de enviar o form.

var frmNoticia = document.getElementById("frmNoticia");
var txtConteudo = document.getElementById("txtConteudo");
var hdfConteudo = document.getElementById("hdfConteudo");

frmNoticia.addEventListener("submit", function (event) {
  //copiando o valor de div#txtConteudo para o input#hdfConteudo
  //desta forma, o que será enviado é hdfConteudo.
  hdfConteudo.value = txtConteudo.textContent;
});
.tres-colunas {  
  -webkit-column-count: 3; /* Chrome, Safari, Opera */
  -moz-column-count: 3; /* Firefox */
  column-count: 3;
}

#txtConteudo {
  max-height: 100px;
  overflow: auto;
  -moz-appearance: textfield-multiline;
  -webkit-appearance: textarea;
  border: 1px solid gray;
  font: medium -moz-fixed;
  font: -webkit-small-control;
  padding: 2px;
  resize: both;
}
<form id="frmNoticia">
  <input id="hdfIdentificador" type="hidden" value="1" />
  <input id="hdfConteudo" type="hidden" value="1" />
  <div>
    <label>
      Titulo:
      <input id="txtTitulo" type="Text" value="" />
    </label>
  </div>
  <div>
    <label>
      Conteudo:
      <div id="txtConteudo" class="tres-colunas" contentEditable="true">
        <p>
          Lorem ipsum dolor sit amet, consectetur adipiscing elit. Quisque mattis efficitur libero, in facilisis libero bibendum eu. Ut pretium elit neque, eget luctus dolor porta quis. Aliquam viverra porttitor nibh, ut mattis urna euismod eget. Aliquam posuere rhoncus ligula, eu ornare risus. Vivamus imperdiet finibus metus eu porttitor. Vivamus sodales tortor ut gravida placerat. Vestibulum auctor, eros nec hendrerit vehicula, ligula felis iaculis ex, nec lobortis nisl purus nec justo. Cras venenatis nisi imperdiet massa volutpat, sed ultricies turpis venenatis.
        </p>
      </div>
    </label>
  </div>
  <div>
      <input id="btEnviar" type="submit" value="Enviar" />
  </div>
</form>

Agora para enviar o conteúdo da DIV, você irá precisar incluir o conteudo no Form.

Segue abaixo duas sugestões, uma assincronia e outra síncrona.

Assíncrona

var frmNoticia = document.getElementById("frmNoticia");
var txtConteudo = document.getElementById("txtConteudo");
var btEnviar = document.getElementById("btEnviar");

btEnviar.addEventListener("click", function (event) {
  //adicionando o conteudo de txtConteudo ao frmNoticia.
  var frmData = new FormData(frmNoticia);  
  frmData.append("txtConteudo", txtConteudo.textContent);  
  
  //enviando formulario de forma assicrona
  var xmlHttp = new XMLHttpRequest();
  xmlHttp.open("POST", "minha URL");
  xmlHttp.onreadystatechange = function () { 
    //retorno do AJAX.
  };
  xmlHttp.send(frmData);
});
.tres-colunas {  
  -webkit-column-count: 3; /* Chrome, Safari, Opera */
  -moz-column-count: 3; /* Firefox */
  column-count: 3;
}

#txtConteudo {
  max-height: 100px;
  overflow: auto;
  -moz-appearance: textfield-multiline;
  -webkit-appearance: textarea;
  border: 1px solid gray;
  font: medium -moz-fixed;
  font: -webkit-small-control;
  padding: 2px;
  resize: both;
}
<form id="frmNoticia">
  <input id="hdfIdentificador" type="hidden" value="1" />
  <div>
    <label>
      Titulo:
      <input id="txtTitulo" type="Text" value="" />
    </label>
  </div>
  <div>
    <label>
      Conteudo:
      <div id="txtConteudo" class="tres-colunas" contentEditable="true">
        <p>
          Lorem ipsum dolor sit amet, consectetur adipiscing elit. Quisque mattis efficitur libero, in facilisis libero bibendum eu. Ut pretium elit neque, eget luctus dolor porta quis. Aliquam viverra porttitor nibh, ut mattis urna euismod eget. Aliquam posuere rhoncus ligula, eu ornare risus. Vivamus imperdiet finibus metus eu porttitor. Vivamus sodales tortor ut gravida placerat. Vestibulum auctor, eros nec hendrerit vehicula, ligula felis iaculis ex, nec lobortis nisl purus nec justo. Cras venenatis nisi imperdiet massa volutpat, sed ultricies turpis venenatis.
        </p>
      </div>
    </label>
  </div>
  <div>
      <input id="btEnviar" type="button" value="Enviar" />
  </div>
</form>

Sincrona

Neste caso você só precisa copiar o conteúdo da div para um hidden antes de enviar o form.

var frmNoticia = document.getElementById("frmNoticia");
var txtConteudo = document.getElementById("txtConteudo");
var hdfConteudo = document.getElementById("hdfConteudo");

frmNoticia.addEventListener("submit", function (event) {
  //copiando o valor de div#txtConteudo para o input#hdfConteudo
  //desta forma, o que será enviado é hdfConteudo.
  hdfConteudo.value = txtConteudo.textContent;
});
.tres-colunas {  
  -webkit-column-count: 3; /* Chrome, Safari, Opera */
  -moz-column-count: 3; /* Firefox */
  column-count: 3;
}

#txtConteudo {
  max-height: 100px;
  overflow: auto;
  -moz-appearance: textfield-multiline;
  -webkit-appearance: textarea;
  border: 1px solid gray;
  font: medium -moz-fixed;
  font: -webkit-small-control;
  padding: 2px;
  resize: both;
}
<form id="frmNoticia">
  <input id="hdfIdentificador" type="hidden" value="1" />
  <input id="hdfConteudo" type="hidden" value="1" />
  <div>
    <label>
      Titulo:
      <input id="txtTitulo" type="Text" value="" />
    </label>
  </div>
  <div>
    <label>
      Conteudo:
      <div id="txtConteudo" class="tres-colunas" contentEditable="true">
        <p>
          Lorem ipsum dolor sit amet, consectetur adipiscing elit. Quisque mattis efficitur libero, in facilisis libero bibendum eu. Ut pretium elit neque, eget luctus dolor porta quis. Aliquam viverra porttitor nibh, ut mattis urna euismod eget. Aliquam posuere rhoncus ligula, eu ornare risus. Vivamus imperdiet finibus metus eu porttitor. Vivamus sodales tortor ut gravida placerat. Vestibulum auctor, eros nec hendrerit vehicula, ligula felis iaculis ex, nec lobortis nisl purus nec justo. Cras venenatis nisi imperdiet massa volutpat, sed ultricies turpis venenatis.
        </p>
      </div>
    </label>
  </div>
  <div>
      <input id="btEnviar" type="submit" value="Enviar" />
  </div>
</form>

Fonte Link
Tobias Mesquita
  • 23,1mil
  • 1
  • 32
  • 52

olha, você pode tornar a div editável

.tres-colunas {  
  -webkit-column-count: 3; /* Chrome, Safari, Opera */
  -moz-column-count: 3; /* Firefox */
  column-count: 3;
}
<div class="tres-colunas" contentEditable="true">
  <p>
    Lorem ipsum dolor sit amet, consectetur adipiscing elit. Quisque mattis efficitur libero, in facilisis libero bibendum eu. Ut pretium elit neque, eget luctus dolor porta quis. Aliquam viverra porttitor nibh, ut mattis urna euismod eget. Aliquam posuere rhoncus ligula, eu ornare risus. Vivamus imperdiet finibus metus eu porttitor. Vivamus sodales tortor ut gravida placerat. Vestibulum auctor, eros nec hendrerit vehicula, ligula felis iaculis ex, nec lobortis nisl purus nec justo. Cras venenatis nisi imperdiet massa volutpat, sed ultricies turpis venenatis.
  </p>
  <p>
    Vestibulum egestas quis mi sit amet auctor. Ut porta lacinia convallis. Donec bibendum, magna sed imperdiet lobortis, sem neque vehicula neque, at ultrices orci nulla a sem. Maecenas blandit quam ac lacinia sagittis. Sed at elit vel metus placerat mattis vel eget est. Vivamus dui justo, dapibus et feugiat in, pharetra eget lectus. Sed viverra eget odio nec elementum. Morbi molestie justo ut turpis malesuada pellentesque. Cras lobortis, ante at suscipit mollis, mi urna hendrerit nisl, id viverra elit diam nec orci. Duis eget aliquam leo, quis dignissim augue.
  </p>
  <p>
    Nulla urna quam, condimentum sed tempus ut, auctor eget tellus. Sed accumsan pulvinar dolor non ullamcorper. Aliquam accumsan ipsum eu ante laoreet eleifend. Aliquam erat volutpat. Quisque in odio elit. Sed neque odio, auctor at ligula eget, condimentum ultricies tellus. Praesent lacinia nulla ut purus lobortis pulvinar. Duis eget pretium massa, ut mollis justo. Suspendisse finibus erat felis, ac porta quam tristique id. Sed posuere semper ultricies. Morbi consequat tempor arcu, ac elementum purus congue sed. Proin sollicitudin, diam vehicula sodales dapibus, eros massa tristique magna, vitae semper massa enim nec tellus. Etiam rutrum sed nulla at egestas. Fusce rhoncus tortor a dolor vestibulum, in dapibus tellus bibendum.
  </p>
  <p>
    Etiam risus lorem, tempor et mollis in, pretium eu purus. Mauris ac iaculis augue. Integer ullamcorper dui magna, id fringilla nunc ullamcorper eu. Sed nunc ipsum, vehicula vitae metus id, commodo mollis turpis. Pellentesque eget nibh vel enim laoreet tincidunt a nec ipsum. Morbi tincidunt massa vel lacinia gravida. Sed lobortis dignissim augue nec elementum. Fusce luctus magna vitae ligula posuere convallis.
  </p>
  <p>
    Praesent mauris ante, tristique at augue id, mollis accumsan nulla. Duis vitae porttitor lorem. Nam et lorem eu mauris convallis vulputate. Aenean a ligula eget eros commodo iaculis placerat tristique mauris. In bibendum iaculis pulvinar. Sed facilisis metus non elit imperdiet, non laoreet sapien semper. Ut sapien purus, maximus at fringilla ut, malesuada ultricies nibh.
  </p>
</div>