[SOLUCIONADO] Desajuste de un DIV al insertar texto en él

isaacbnc · #1 (**permalink**) 12/11/2015, 11:07

Hola a todos,
Estoy creando una página que muestre datos de una base de datos de forma paginada, para eso, creo un Div (registro) que contiene otros 3 divs (contenido, editar y eliminar).
El caso es que los 3 divs han de estar juntos y en la misma línea. Lo conseguí hacer cuando no había texto, pero ahora que he creado la conexión a la base de datos y he insertado el texto en el primer DIV (contenido) se echa para abajo.

Como puedo hacer que se mantenga?

Adjunto mi código:

Código HTML:

<body>
<h1>EDITAR CONTENIDO</h1>

<?php foreach ($entradas as $row): ?>
<div id="registro">
<div id="contenido">
<?php echo $row["Titulo"]; ?><BR>
<?php echo $row["Descripcion"]; ?>

</div>

<div id="editar">
</div>

<div id="eliminar">
</div>
</div>
<?php endforeach ?> 

</body>

Código CSS:

Ver original#contenido{
 
    
width:30%;
height:75px;
margin: 0 auto;
border: 4px solid;
border-top-left-radius: 25px;
border-bottom-left-radius: 25px;
border-color:black;
align-items: center;
margin-left:10%;
display: inline-block;  
}
 
 
#editar{
    
width:5%;
height:75px;
border-top: 4px solid;
border-bottom:4px solid;
border-right:4px solid;
margin-left: -5px;
border-color:black;
display: inline-block;  
}
 
#eliminar{
width:5%;
height:75px;
border-top: 4px solid;
border-bottom:4px solid;
border-right:4px solid;
margin-left: -5px;
border-color:black;
display: inline-block;
border-top-right-radius:25px;
border-bottom-right-radius:25px;
}

Gracias desde ya!

DesgraciadoGabo · #2 (**permalink**) 13/11/2015, 10:13

No sé si sea yo pero no veo el id "registro" que tal vez en este caso no importe, pero la solución a tu problema esta en un simple overflow-y:scroll

te muestro el ejemplo, según el código que nos muestras:
http://jsfiddle.net/b9bx7px9/

Saludos!

AngelKrak · #3 (**permalink**) 13/11/2015, 13:38

Prueba dandole un float: left; al #contenido ;)

isaacbnc · #4 (**permalink**) 13/11/2015, 17:26

Gracias a los dos, finalmente lo solucioné con un margin-bottom en los divs editar y eliminar.
Saludos!