0

Estoy en un parcial y me debería de quedar el pie de página así:

como me deberia quedar. Pero a mí me queda así:

Mi diseño

Acá dejo mi código:

#pie {
  background-color: #000000;
  clear: both;
  border-bottom: 2px solid #424242;
}

h3 {
  color: #FFFFFF;
}

#ultimamoda {}

img.ulmoda {
  border: 1px solid #A4A4A4;
  padding: 6px;
  float: left;
  margin: 10px;
}

p.ulmoda {
  float: left;
  color: #FFFFFF;
}

#horoscopo {
  float: left;
  color: #FFFFFF;
  margin: 0px 20px 90px 90px;
}

img.ih {
  width: 80px;
  height: 80px;
}

#contactanos {
  color: #FFFFFF;
  margin: 0px 110px 110px 150px;
}
<div id="pie">

  <!-- pie de pagina -->

  <div id="ultimamoda">
    <h3>La ultima Moda!!!</h3>
    <hr align="left" width="300"> </hr>
    <img class="ulmoda" src="images/moda.jpg">
    <p class="ulmoda"> Rompe la monotía de los <br> colores apagados y aburridos y <br> llena tu armario del color de <br> moda de este verado 2011: el <br> naranja. ¡No te pierdas la<br> galeria! Moda en color naranja..<br>
      <a href=””>leer nota>></a>
    </p>
  </div>


  <div id="horoscopo">
    <p> Horoscopo </p>
    <hr align="left" width="200"> </hr>
    <img class="ih" src="images/h1.jpg">
    <img class="ih" src="images/h2.jpg">
    <img class="ih" src="images/h3.jpg"><br>
    <img class="ih" src="images/h4.jpg">
    <img class="ih" src="images/h5.jpg">
    <img class="ih" src="images/h6.jpg">
  </div>

  <div id="contactanos">

    <p> contactenos! <br>
      <hr align="left" width="200"> </hr>
      Razón social <br> Dirección: <br> Ciudad: <br> CP:
      <br> tel: xxxx xxxxx xxxxx <br> Fax: xxxx xxxxx xxxxx <br> Email: [email protected] <br> Link: <a HREF>Mi empresa</A>
    </p>
  </div>


</div>

2 respuestas 2

0

Podrías utilizar la propiedad de flexbox (https://developer.mozilla.org/es/docs/Web/CSS/CSS_Flexible_Box_Layout/Usando_las_cajas_flexibles_CSS). Flexbox te permite ordenar los elementos hijos del selector en el que escribas la propiedad en fila o columnas y además le puedas dar una alineación según te convenga. Un ejemplo sería:

.contenedor {
  display: flex;
  flex-direction: row;
  align-items: baseline;
}

.elemento {
  width: 25%;
  padding: 5px;
}
<div class="contenedor">
  <div class="elemento">
    <h1>Ejemplo 1</h1>
    <hr>
    <p>Esto es un parrafo de ejemplo</p>
  </div>
  <div class="elemento">
    <h1>Ejemplo 2</h1>
    <hr>
    <p>Esto es un parrafo de ejemplo</p>
  </div>
  <div class="elemento">
    <h1>Ejemplo 3</h1>
    <hr>
    <p>Esto es un parrafo de ejemplo</p>
  </div>
</div>

0

Para que el texto quede como el del ejemplo, se debe agregar el justificado con la etiqueta P ALIGN="justify" en el parrafo del class "ulmoda", y para el texto con la etiqueta br cambiala por p, el tamaño se arregla en el codigo en css con px, asi deberia de quedar mas parecido.

Tu Respuesta

By clicking “Publica tu respuesta”, you agree to our terms of service and acknowledge you have read our privacy policy.

¿No es la respuesta que buscas? Examina otras preguntas con la etiqueta o formula tu propia pregunta.