tutorial html y css | posicionamiento de divs en el contenedor general (basico)

แชร์
ฝัง
  • เผยแพร่เมื่อ 9 ม.ค. 2013
  • en este video vamos a introducirnos en el posicionamiento de los divs en el contenedor principal. veremos como podemos crear la estructura basica de una web de una manera muy sencilla sin que se nos deforme al cambiar la resolucion de la pantalla
    siguenos en twitter! / keyquotes_group
    visita nuestra web oficial: www.keyquotes.es
    un saludo de parte del equipo de Keyquotes

ความคิดเห็น • 233

  • @leptium
    @leptium 3 ปีที่แล้ว +6

    Busqué cerca de 10 videos. El más paciente y el mejor explicado de todos. Sin muchos rollos y con la explicación perfecta. Saludos desde Perú.

  • @ipone6glisto953
    @ipone6glisto953 4 ปีที่แล้ว +1

    Muchas gracias por este agnífico video. Llevaba tres días peinando la red y solo encontraba cosas raras y nadie enseñaba claramente esto como tú. Muchas gracias y ya me he sumado a tu canal.

  • @camilotinoco1419
    @camilotinoco1419 8 ปีที่แล้ว +41

    debería colocar los códigos que usa en la descripción del vídeo, con eso nos ayudaría bastante.

  • @wilwerrodriguez1787
    @wilwerrodriguez1787 8 ปีที่แล้ว +2

    mil gracias, tienes una forma de enseñar muy especial, por que no se ve dificil ni complicado cuando lo haces y lo explicas.

  • @meowner1
    @meowner1 4 ปีที่แล้ว +2

    Aún después de siete años sirve, gracias, este vídeo fue muy útil, sigue así, haces muy buenos vídeos

  • @StreiaLunar
    @StreiaLunar 8 ปีที่แล้ว

    de verdad que llevo mas d 1 mes intentando hacer mi proyecto y faltaba posicionar algo q no entendia.. y Ud m ayudo con su tutorial.. mil graciaaaas ;( :D Saludos desde Lima-Peru

  • @franarauz7736
    @franarauz7736 8 ปีที่แล้ว +1

    Muy bueno el tutorial. especialmente para principiantes como yo. saludos.
    la logística es entendible sobre el posicionamiento de los divs.

  • @carzmusicacreacionlecturac789
    @carzmusicacreacionlecturac789 3 ปีที่แล้ว

    Muy bien, keyquotes, un abrazo y mis gracias con felicitaciones; aprendí bastante y de manera bastante sencilla. Veo que tienes buenos conocimientos. Dios siga ayudándote

  • @st0rmArYa
    @st0rmArYa 5 ปีที่แล้ว +1

    Muchas gracias, me había trabado al hacer las cajas o bloques (como se llamen jaja) contigo lo he entendido mejor, ahora lo llevaré a la práctica..Gracias, te seguiré.

  • @777whitemetal777
    @777whitemetal777 6 ปีที่แล้ว +1

    he aprendido más con varios vídeos tuyos que en toda la primera evaluación.

  • @florenciaisagalindo6410
    @florenciaisagalindo6410 4 ปีที่แล้ว

    Muchas gracias!! la explicación es muy clara y sencilla. Saludos

  • @TheByMarkel
    @TheByMarkel 8 ปีที่แล้ว

    Eres el mejor, te lo agradezco mucho!! Mercii y sigue asi

  • @jamming1984
    @jamming1984 9 ปีที่แล้ว

    muchas gracias!!! con este tutorial me ayudaron muchisimo :)

  • @rafa_marz
    @rafa_marz 3 หลายเดือนก่อน

    Me sirvió muchísimo, llevaba bastante tiempo tratando de arreglar un div para una barra lateral y el error era que la tenia afuera del div general, muy buen video 👍

  • @keyquotes
    @keyquotes  11 ปีที่แล้ว +4

    yes, im gonna upload videos little by little with more advanced concepts, i hope you learn a lot with these videos
    greetings

  • @ramond12
    @ramond12 2 ปีที่แล้ว

    Estuvo muy bueno el video, se aprende rápido de esta manera. Gracias 😁

  • @nicolaspelegrin9314
    @nicolaspelegrin9314 7 ปีที่แล้ว

    Más claro imposible. Muchas gracias!

  • @hanita1394
    @hanita1394 10 ปีที่แล้ว

    Gracias por el tutorial !! Explicas de maravilla ;)

  • @dannadelzomeza-ddmez1652
    @dannadelzomeza-ddmez1652 9 ปีที่แล้ว

    Hola! gracias por los vídeos, son super didácticos y la explicación es concisa y clara. Tienes mas vídeos sobre posicionamiento de cajas en contenedores? `por favor refieremelas. Gracias!

  • @buhoo__
    @buhoo__ 7 ปีที่แล้ว

    Sos la luz viejo! lo sabias? gracias por el Tuto!

  • @andresvega6001
    @andresvega6001 10 ปีที่แล้ว

    Muy buen tutorial, me subscribi espero mas contenido como este +10

  • @sebarusempai6306
    @sebarusempai6306 6 ปีที่แล้ว +1

    me sirvió de mucho este vídeo, gracias, espero subas mas de esto,ya que recién estoy empezando y explicas bien y fácil de entender.

  • @boone5741
    @boone5741 5 ปีที่แล้ว

    Me sirvio mucho para salir de un apuro de ultima hora. Muchas gracias!

  • @patopaolo
    @patopaolo 10 ปีที่แล้ว +115

    aprendo contigo más que en clases

    • @bryceguido8285
      @bryceguido8285 7 ปีที่แล้ว +4

      si los docentes no enseñas nica

    • @juanzambranasejas8342
      @juanzambranasejas8342 5 ปีที่แล้ว +4

      los docentes parecen ser envidiosos nunca enseñan solo dicen ya deberias saber o se acercan no dicen nada y se van ajaja

    • @juanzambranasejas8342
      @juanzambranasejas8342 5 ปีที่แล้ว +2

      por eso es importante colaborar a los maestros en youtube con un like y suscribirse

    • @nataliyarin6751
      @nataliyarin6751 4 ปีที่แล้ว

      yo tambien:v

    • @andreslopez-oc5hm
      @andreslopez-oc5hm 4 ปีที่แล้ว +1

      tienes razón porque en la escuela los profesores solo se la pasan platicando de una cosa u otra y no te enseñan bien por esto varios alumnos no aprenden aquí youtube aprendes rápido aunque sea lo básico

  • @alberboxtytravel
    @alberboxtytravel 5 ปีที่แล้ว

    he aprendido contigo mas que con falcon masters en cuestion de posicionamiento de cajas like maquina

  • @AProgramar
    @AProgramar 11 ปีที่แล้ว +3

    Muy buen tutorial, también estaría bien poner este mismo tutorial con display:inline-block para ver otras posibilidades.

  • @satanvato8808
    @satanvato8808 3 ปีที่แล้ว

    Brooooo realmente me haz salvado estoy muy agradecido saludos

  • @CookieMan_YT
    @CookieMan_YT 7 ปีที่แล้ว

    Gracias a tus tutoriales pase mi semestre

  • @juanmanueldelapena6805
    @juanmanueldelapena6805 10 ปีที่แล้ว

    perfecta explicación, clara y sin pausa, un 10 :-)

    • @desk6173
      @desk6173 3 ปีที่แล้ว

      sigues vivo?

  • @fanygomez3689
    @fanygomez3689 8 ปีที่แล้ว +2

    buen video!! >D gracias por compartir, una pregunta tienes ejemplos usando posición absoluta,fija y relativa?

  • @harbett_
    @harbett_ 11 ปีที่แล้ว

    Gracias amigo!!!
    Esto estaba buscando tutoriales de pocisionamiento
    Olle puedes hacer seguir haciendo este tipo de videos asi como de adobe edge tambien

  • @papierick0285
    @papierick0285 4 ปีที่แล้ว +1

    Buen video bro, gran calidad, excelente audio, muchas gracias bro me ayudaste muchísimo ✌️🥺

    • @keyquotes
      @keyquotes  4 ปีที่แล้ว +1

      EsseErickson me alegro que te haya servido! 🤪

  • @user-rz8no4js8z
    @user-rz8no4js8z 6 หลายเดือนก่อน

    Muchas gracias, Me gustó mucho tu explicación

  • @emanuelesparraguera48
    @emanuelesparraguera48 ปีที่แล้ว

    Buenos vídeos.
    Son de mucha ayuda

  • @josrolandogranadosrivera4933
    @josrolandogranadosrivera4933 2 ปีที่แล้ว

    Gran tutorial me sirvió bastante para lo que mi profesor no explico, muchas gracias

  • @johnnyduran2527
    @johnnyduran2527 7 ปีที่แล้ว

    excelente video!! entendí mas que en clases

  • @tecnomao5276
    @tecnomao5276 3 ปีที่แล้ว

    Dios, me has salvado la vida. Gracias

  • @cristianbustamante62
    @cristianbustamante62 6 ปีที่แล้ว +1

    gracias por fin entendí como mover los css

  • @v92Promo
    @v92Promo 8 ปีที่แล้ว

    Muy bueno el video; super!!!

  • @carlosneyra7044
    @carlosneyra7044 3 ปีที่แล้ว

    te amo viejo, me has salvado de una

  • @Narux
    @Narux 5 ปีที่แล้ว

    Muchas gracias por el vídeo.!!!

  • @eduardovaldezlopez567
    @eduardovaldezlopez567 7 ปีที่แล้ว

    Muy bueno tu video me ayudo muchisimo ya tienes un subscritor mas :D

  • @keyquotes
    @keyquotes  11 ปีที่แล้ว +1

    ok gracias por el aporte, lo tendre en cuenta

  • @edwinloaiza1017
    @edwinloaiza1017 7 ปีที่แล้ว

    felicitaciones excelente despeje muchas dudas gracias

  • @jamesceballos4197
    @jamesceballos4197 7 ปีที่แล้ว

    excelente tutorial. gracias.

  • @milkyway3466
    @milkyway3466 8 ปีที่แล้ว

    muy buena bro me salvo!

  • @josecerda6278
    @josecerda6278 4 ปีที่แล้ว

    Muchas gracias por la explicacion, muy claro todo.

    • @keyquotes
      @keyquotes  4 ปีที่แล้ว +1

      Me alegro que te haya ayudado!!

  • @WagnerDeCampos
    @WagnerDeCampos 10 ปีที่แล้ว

    nuevamente muy bueno el tut

  • @wilog3843
    @wilog3843 7 ปีที่แล้ว +1

    Muchas gracias viejo, te amo :v

  • @jrmanov
    @jrmanov 2 ปีที่แล้ว

    Muy bien explicado!!

  • @mix-to2472
    @mix-to2472 8 ปีที่แล้ว

    Exelente Muy bueno!! :D

  • @UlisesGB.
    @UlisesGB. 7 ปีที่แล้ว

    amigo mio te agradezco infinitamente estaba pariendo chinos con eso...saludos (Y)

  • @cristianrubattovivas9745
    @cristianrubattovivas9745 9 ปีที่แล้ว

    Te mereces mi suscripcion hermano , me ayudaste , GRACIAS

  • @isaacmorenohernandez485
    @isaacmorenohernandez485 6 ปีที่แล้ว

    buen video, explicas bien.

  • @unciudadanoejemplar5097
    @unciudadanoejemplar5097 7 ปีที่แล้ว +1

    A mi me sucede que cuando agrego la etiqueta aside y section , me salen una abajo de otra , con las dimensiones correctas, pero desplazadas hacia la izquierda una a continuacion de la otra , no puedo flotarlas , no se que sera

  • @keyquotes
    @keyquotes  11 ปีที่แล้ว +5

    eso es porque el navegador añade a tus elementos unos margin y padding por defecto, para solucionar este problema solo tienes que añadir al principio de tu css un reset, es decir añade esta linea de codigo: *{margin:0px; padding:0px} este codigo lo que hace es eliminar los margin y los padding que pone el navegador
    un saludo

  • @thekookero
    @thekookero 10 ปีที่แล้ว

    Esto ha sido de lo más instructivo. Te agradezco muchísimo.
    Ya he visto varios de tus videos y he puesto en práctica algunos ejemplos con muy buenos resultados. También me ha servido para modificar un sitio que tenía hecho anteriormente :)
    Tengo una pregunta:
    Lo primero que escribes en la plantilla css es *{ y abajo margin 0px padding 0px } ...
    ¿cuál es el fin específico de eso?
    Muchísimas gracias por tu gran aporte! Sigue haciendo vídeos, saludos!

  • @suntienda5749
    @suntienda5749 3 หลายเดือนก่อน

    Gracias muy buen video

  • @eylercruzramirez5682
    @eylercruzramirez5682 8 ปีที่แล้ว

    exelente video gracias cumpita ^_^

  • @YoSoyDivina
    @YoSoyDivina 10 ปีที่แล้ว

    Gracias, muy bueno.

  • @cybermozilla6171
    @cybermozilla6171 7 ปีที่แล้ว

    +keyquoyes saludos gracias por tomarte la molestri ade hacer estas guias, mi consulta es si se ejecuta en android al ponerle valores estaticos no habria inconveniente?

  • @martinr.4795
    @martinr.4795 10 ปีที่แล้ว

    Hola, una consulta, existe forma de hace la maquetación en posiciones absolutas y a la vez que sea fluida? quiero usar proporciones aureas y las dos cosas al mismo tiempo no salen, es decir que sea proporcional y que aparte se adapte al navegador. Saludos.

  • @diliasanchez3706
    @diliasanchez3706 7 ปีที่แล้ว +1

    excelente, muchísimas gracias. Enseñas mejor que mi profesor. :/

  • @CesarFabian1891
    @CesarFabian1891 5 ปีที่แล้ว

    excelente video

  • @camilaerr3708
    @camilaerr3708 4 ปีที่แล้ว

    gracias wey te amo estaba toda perdida enseñas mejor que mi profe u_u te agradezco mucho este video

    • @keyquotes
      @keyquotes  4 ปีที่แล้ว

      Me alegro que te haya servido! 😜

  • @FilipeLosoft
    @FilipeLosoft 10 ปีที่แล้ว

    Gostei do vídeo muito bom continue assim

  • @loanyelo15
    @loanyelo15 5 ปีที่แล้ว +1

    ¿como moverías el rojo con los cuadros que tiene adentro sin que pierdan el orden y que sigan pegados? y hacerlos flexbox

  • @zenekis
    @zenekis 5 ปีที่แล้ว

    Hola gracias por el video, para que sirve la etiqueta de reset que creas al principio de la hoja de estilos??

  • @Preto070
    @Preto070 10 ปีที่แล้ว

    Muchas Gracias!!!!!

  • @elkinpineda457
    @elkinpineda457 3 ปีที่แล้ว

    Buena explicación.

  • @andreluis1117
    @andreluis1117 8 ปีที่แล้ว

    obrigado, +1 inscrito!

  • @moni7970
    @moni7970 9 ปีที่แล้ว

    muchas gracias!!!!!!!!!!!!

  • @desagotelaestrella5816
    @desagotelaestrella5816 5 ปีที่แล้ว

    GRACIAS!!! Y muy bueno que no pones música de fondo!!

  • @keyquotes
    @keyquotes  11 ปีที่แล้ว

    gracias a ti
    un saludo

  • @pauloantoniovallejosvallejos
    @pauloantoniovallejosvallejos 8 ปีที่แล้ว

    muy bueno gracias

  • @pachecorosalesjuliocesar6908
    @pachecorosalesjuliocesar6908 3 ปีที่แล้ว

    justo lo que queria ver

  • @juanmad4300
    @juanmad4300 9 ปีที่แล้ว

    excelente gracias

  • @juanfeliperestrepo6262
    @juanfeliperestrepo6262 11 ปีที่แล้ว

    desde colombia muchas gracia amigo esto era exactamente lo que estaba buscando para unas duda inmensa que tenia

  • @Tomy_Music
    @Tomy_Music 4 ปีที่แล้ว

    Hola bro, tengo una pregunta: ¿Como hago para montar el texto encima del recuadro

  • @adrianaleman9894
    @adrianaleman9894 4 ปีที่แล้ว

    Amigo se puede añadir una barra vertical de navegacion en un solo div y en otro div colocarle texto al lado derecho?

  • @corracaia
    @corracaia 9 ปีที่แล้ว +3

    Hola amigo muy buen video, mira, es necesario que siempre se haga un contenedor general para poner todo ahí??

    • @keyquotes
      @keyquotes  9 ปีที่แล้ว +1

      se hace por el encuadre de los divs, sobre todo por las diferentes resoluciones que tienen las pantallas de hoy en dia.
      un saludo

  • @borisrojas3123
    @borisrojas3123 11 ปีที่แล้ว +1

    Puedes poner además de pixeles en las medidas, porcentajes? para que ocupen toda la pantalla independiente del tamaño de esta?

  • @wiki-SMART
    @wiki-SMART 2 ปีที่แล้ว

    gracias!

  • @hugocangi6214
    @hugocangi6214 10 หลายเดือนก่อน

    buen dia con este video ,me ayudaste un monton te agrasdezo
    solo me falta colocarles imagenes y oraciones
    si tenes ese video pasamelo te agradezco un monton
    hugo

  • @anamariaarbelaezlopez4783
    @anamariaarbelaezlopez4783 5 ปีที่แล้ว

    Gracias!

  • @migue_sofoke13
    @migue_sofoke13 4 ปีที่แล้ว +1

    Nice 👌🏾

  • @crs7933
    @crs7933 5 ปีที่แล้ว

    videaco

  • @kaosnocturno
    @kaosnocturno 11 ปีที่แล้ว

    muy buen tutorial, tengo una pregunta yo no pongo margin- top y de todos modos cuando visualizo mi pagina aparece separada en la parte superior y se supone que debe aparecer a ras pero no es asi, me puedes decir a que se debe eso

  • @kellyshemelly2376
    @kellyshemelly2376 6 ปีที่แล้ว

    Quisiera saber si eso también se puede hacer en section

  • @keyquotes
    @keyquotes  10 ปีที่แล้ว

    la funcion de ese codigo basicamente es aliminar los margenes y los paddings que pone el navegador por defecto ya que cada navegador pone una medida diferente, yo prefiero trabajar sin los margenes ni paddings automaticos de los navegadores ya que a veces pueden llevarte a confusion
    un saludo

  • @jhonpulgarin9488
    @jhonpulgarin9488 3 ปีที่แล้ว

    muchas gracias por tus conocimientos :3

  • @RamzyElias
    @RamzyElias 11 ปีที่แล้ว

    Wow. i like your videos. thank you and i hope more. and i hope learn how make website .

  • @natalypolovargas9908
    @natalypolovargas9908 6 ปีที่แล้ว

    me puede brindar su ayuda, quisiera aprender hacer una maquetacion en sublime utilizando el codigo php; como le podria enviar un trabajo

  • @yoteenseno2672
    @yoteenseno2672 5 ปีที่แล้ว

    holois dixulpa pero el codigo li introdusco en sublime tex y en notepad++ y no me acesta el css i no beo nada de canvios a grafica ya que la pajina esta solo en blanco

  • @FanetikStudio
    @FanetikStudio ปีที่แล้ว

    hola, porfavor, con que etiqueta o atributo podria mover cualquier div, a cualquier pocicion que necesitacemos? Por ejemplo digamos que necesito mover el Div Azul en la parte central del Div Lila(morado) Muchas Gracias!

  • @hermain-vm
    @hermain-vm 10 หลายเดือนก่อน

    Buen video, tengo un menu, y un formulario, en el formulario las label las muestra como link y la parte del form tambien como, le hago para que no me salgan asi?

  • @GerardoKasevich
    @GerardoKasevich 7 ปีที่แล้ว

    gracias

  • @tinta010
    @tinta010 10 ปีที่แล้ว

    hola una consulta como haces para que el div ofertas quede en top ami me queda en el medio diremos... gacias

  • @diegopina1186
    @diegopina1186 3 ปีที่แล้ว

    Puto Genio me haz abierto los ojos

  • @diegopichaco9384
    @diegopichaco9384 11 ปีที่แล้ว +1

    solo me aparece el primer div los siguientes no aparecen a que puede ser debido.
    gracias