Ya que lo que se busca es que el texto, al superar a su contenedor, sea el que se corte y muestre una elipsis, es al párrafo (que es el contenedor del texto) al que debemos darle las propiedades:
CSS
.resumen p {
overflow: hidden;
white-space: nowrap;
text-overflow: ellipsis;
}
Ejemplo
.articulo {
background-color: white;
margin: 4%;
}
.resumen{
width: 380px;
margin: -6% 2% 2% 2%;
height: 100px;
}
.resumen p {
overflow: hidden;
white-space: nowrap;pre;
text-overflow: ellipsis;
}
.articulo:hover{
cursor: pointer;
}
.imagen{
background: url(../img/prueba.png);
background-repeat: no-repeat;
background-size: 100% 80%;
height: 200px;
}
<div class="articulo">
<div class="imagen"></div>
<div class="resumen">
<h3>Título</h3>
<p>
Lorem ipsum dolor sit amet consectetur adipisicing elit. Deleniti alias ducimus eius ad
facere,
quidem optio odio, illo odit, nobis magnam quo natus? Corporis obcaecati natus quas expedita
eius
minus!
</p>
<p>
Lorem ipsum dolor sit amet consectetur adipisicing elit. Deleniti alias ducimus eius ad
facere,
quidem optio odio, illo odit, nobis magnam quo natus? Corporis obcaecati natus quas expedita
eius
minus!
</p>
</div>
<a href="#">Ver más</a>
</div>
Editado
Con white-space: nowrap
lo que provocas es que los saltos de líneas que tienes dentro del <p>
no sean interpretados, mostrando todo el contenido en una sola línea. Usando white-space: pre;
conseguirías lo que creo que pretendes alcanzar.