elhacker.net cabecera Bienvenido(a), Visitante. Por favor Ingresar o Registrarse
¿Perdiste tu email de activación?.

 

 


Tema destacado: Trabajando con las ramas de git (tercera parte)


+  Foro de elhacker.net
|-+  Programación
| |-+  Desarrollo Web (Moderador: #!drvy)
| | |-+  Posicionamiento texto dentro de un div
0 Usuarios y 1 Visitante están viendo este tema.
Páginas: [1] Ir Abajo Respuesta Imprimir
Autor Tema: Posicionamiento texto dentro de un div  (Leído 1,862 veces)
ars1993

Desconectado Desconectado

Mensajes: 60


640k deberian ser suficientes para todo el mundo..


Ver Perfil
Posicionamiento texto dentro de un div
« en: 2 Febrero 2014, 16:37 pm »

Buenas, tengo un problema de posicionar un texto dentro de un div con CSS. Me gustaria que saliese centrado tanto verticalmente como horizontalmente.
Para centrarlo horizontalmente he usado "text-aligh: center" y para centrarlo verticalmente he probado varias cosas pero sin exito: display:table-cell;vertical-align:middle; etc etc (varias cosas que he encontrado por ahí).

El problema es que el texto se centra horizontalmente pero la parte inferior de las letras se sale un poco del div cuando por arriba de las letras sobra muuucho espacio.

Alguien me puede proponer una solución para ésto? En principio no tiene que ser ningún problema de los "margin" (que a veces pueden tocar las narices). Pongo aquí la porción de código para que lo vean si quizá estoy haciendo algun error:

HTML:
Código
  1. <div class = "login">
  2. <div class = "titol_login">
  3. <h2>ACCÉS DELS MÚSICS</h2>
  4. </div> <!--titol_login-->
  5. </div> <!--login-->
  6.  

CSS:
Código
  1. .login{
  2. height: 170px;
  3. width: 370px;
  4. margin-top: 10px;
  5. margin-right: 10px;
  6. margin-bottom: 10px;
  7. margin-left: 10px;
  8. float: right;
  9. border: 10px solid #FE2E2E;
  10. background-color: yellow;
  11. border-top-left-radius: 40px;
  12. border-bottom-right-radius: 40px;
  13. border-bottom-left-radius: 40px;
  14. }
  15.  
  16. .titol_login{
  17. height: 40px;
  18. width: 370px;
  19. position: absolute;
  20. background-color: blue;
  21. border-top-left-radius: 20px;
  22. background-color: blue;
  23. text-align: center;
  24. }
  25.  


« Última modificación: 2 Febrero 2014, 16:39 pm por @drvy » En línea

640k deberian ser suficientes para todo el mundo..
EFEX


Desconectado Desconectado

Mensajes: 1.171


"Dinero Facil"


Ver Perfil WWW
Re: Posicionamiento texto dentro de un div
« Respuesta #1 en: 2 Febrero 2014, 17:28 pm »

El texto esta corrido por que h2 tiene prefijo un margin, podes verlo aprentado ctrl+alt+i, seleccionas h2 con el mouse y en Box Model ves que posee un margen arriba y abajo.

Asi que podes sacarlo..
Código
  1. h2{
  2. margin: 0px;
  3. }

Existe archivos css para resetearlos y que no te den conflicto de entrada, se llaman css reset y son solo archivos css.


En línea

ars1993

Desconectado Desconectado

Mensajes: 60


640k deberian ser suficientes para todo el mundo..


Ver Perfil
Re: Posicionamiento texto dentro de un div
« Respuesta #2 en: 2 Febrero 2014, 19:14 pm »

Muchas gracias! desconocia lo del margen por defecto en los h2. Me has solucionado el problema.
En línea

640k deberian ser suficientes para todo el mundo..
Páginas: [1] Ir Arriba Respuesta Imprimir 

Ir a:  

Mensajes similares
Asunto Iniciado por Respuestas Vistas Último mensaje
Busqueda dentro de un archivo de texto
Programación Visual Basic
SheKeL_C$ 2 1,883 Último mensaje 20 Febrero 2006, 11:21 am
por SheKeL_C$
Encontrar una palabra dentro de un texto
Programación Visual Basic
Hendrix 4 1,879 Último mensaje 6 Marzo 2006, 16:01 pm
por Hendrix
Encontrar palabra dentro de un texto...
Programación Visual Basic
Edu 5 3,004 Último mensaje 11 Septiembre 2010, 17:57 pm
por Edu
Insertar texto dentro de otro?
.NET (C#, VB.NET, ASP)
Edu 3 4,668 Último mensaje 9 Abril 2011, 20:05 pm
por Edu
Facebook apostará por las transcripciones de voz a texto dentro de Messenger
Noticias
wolfbcn 0 1,080 Último mensaje 17 Enero 2015, 13:45 pm
por wolfbcn
WAP2 - Aviso Legal - Powered by SMF 1.1.21 | SMF © 2006-2008, Simple Machines