Hacer Pregunta

Conecta

entre Desarrolladores

Recibe ayuda de expertos

Registrate y pregunta

Es gratis y fácil

Recibe respuestas

Respuestas, votos y comentarios

Vota y selecciona respuestas

Recibe puntos, vota y da la solución

Pregunta

2votos

colocar imágenes en filas con CSS

preguntó
Web
4073 Vistas
1 Respuestas
solucionada

Buenas tardes

Llevo varios días para colocar estas fotos de tres en tres (dos filas y tres columnas )
http://pruebagonzalo.org.es/colchones/colchones2.html

Me da la sensación que la clave es esto 

<div class="portfolio-item apps col-xs-4 col-sm-5 col-md-4">

Pero no doy con la solución , he modificado colocando todas las opciones sin exito

La página de la plantilla original es esta

http://pruebagonzalo.org.es/colchones/portfolio.html

Como tengo 3 fotos quiero ponerlo en tres columnas y dos filas y quiero poner una descripción de 20 palabras de cada imágen

Muchas gracias

por gonzalss (3.730 puntos) en Web
editado por

-2votos

steven comentado

no se si es asi pero me da la sensacion que tu trabajas como front y no sabes como hacer eso vamos haslo a tu modo con un sencilla regla css cualquiera puede hacer eso sino es asi pues vamos sigue probando prueba todas las combinaciones

por steven (5.100 puntos)

1 Respuesta

0voto

Peter Puntos150480

El problema esta en el CSS que le aplicas a las columnas de bootstrap.

position: absolute;
left: 0px;
top: 0px;
transform: translate3d(387px, 586px, 0px);

Quita ese CSS y verás como te funciona tal y como lo tienes.

No estaría de más que le eches un ojo a las columnas de Bootstrap.

Saludos.

por Peter (150.480 puntos)
seleccionada por

-2votos

steven comentado

tio vamos si no ha entendido la explicacion de la documentacion o por tutos es obvio que viene aqui no seas antipatico con ese tipo de respuestas nadie vieene aqui a trollerar como tu puedes pensar

por steven (5.100 puntos)

0voto

gonzalss comentado

No encuentro en los CSS que tengo el código al que te refieres.

position: absolute;
left: 0px;
top: 0px;
transform: translate3d(387px, 586px, 0px);

¿Podrías indicarme donde está por favor?

Gracias

por gonzalss (3.730 puntos)

0voto

Peter comentado

Entonces el el mismo de Bootstrap y puede que al mezclar las columnas te de problema.

¿Si solo dejas .col-md-4 te funciona?
¿En que estás probando el resultado, en tu computadora?

Saludos.

por Peter (150.480 puntos)

0voto

gonzalss comentado

si si ,lo estoy probando en el ordenador.
Dejo solo col-md4 y lo subo al servidor para que lo veas .

por gonzalss (3.730 puntos)

0voto

gonzalss comentado

He subido la página dejando solo 


            <div class="row">
                <div class="portfolio-items">
                    <div class="portfolio-item apps  col-md-4">
                        <div class="recent-work-wrap">
                            <img class="img-responsive" src="images/portfolio/MUELLE.png" alt="">
                            <div class="overlay">
                                <div class="recent-work-inner">
                                    <h3><a href="index.html">MUELLE</a></h3>
                                    <p>En Soluciones del Descanso solo trabajamos los mejores muelles de </p>
                                    <a class="preview" href="images/portfolio/full/item1.png" rel="prettyPhoto"><i class="fa fa-eye"></i> 
                                    View</a>
                                </div> 
                            </div>
                        </div>
                    </div>

http://pruebagonzalo.org.es/colchones/colchones2.html

sigue sin colocarse las imágenes como yo quiero

por gonzalss (3.730 puntos)
editado por

0voto

gonzalss comentado

Si pong solo col-md-3 , se me ponen en dos filas , la primera fila con 4 imágenes y la segunda con dos. Me voy acercando...

por gonzalss (3.730 puntos)
movido por

0voto

Peter comentado

Ese CSS viene de jquery.isotope.min.js

En el ejemplo 2 que pones, las columnas siguen siendo "portfolio-item apps col-md-4 isotope-item". Quita isotope-item para ver el resultado.

Saludos.

por Peter (150.480 puntos)

Por favor, accede o regístrate para responder a esta pregunta.

Otras Preguntas y Respuestas


Sin Respuesta

Preguntas relacionadas

Actividad Reciente

Ultimas Preguntas

Preguntas relacionadas

Usuarios Top

Todos los Usuarios Usuarios Nuevos

Etiquetas

Categorías

...

Bienvenido a entre Desarrolladores, donde puedes realizar preguntas y recibir respuestas de otros miembros de la comunidad.

Etiquetas

Categorías

Conecta