reconversión
7 seguidores
ya me he comprado el dichoso librito que tanto recomendais de CSS, así que decidle a vuestros coleguitas Briggs y compañía que disponen de 21 euros más en su cuenta gracias a vosotros ;)
la verdad es que llevo unas 40 páginas y tiene una pinta muy buena. prometo ir aplicando las sugerencias y las reglas propuestas en él para ir migrando mi HTML obsoleto e inadecuado a XHTML, y contribuir a hacer de la web un sitio más gonito, accesible y adecuado a sus intenciones originales.
muerte al <table> y al <font>!! :D
txuma Plus
Ufffff..... NS4...... mucho ánimo ;)
cbp
bueno, a ver, aquí dicen que hay dos opciones, la de ambos márgenes negativos y que no funciona en el Opera, y la de meter un <div> contenedor de un 1px y dentro de él el <div> que queremos centrar en vertical. esta última al parecer funciona bien en Opera, aunque la primera a mí me va bien en el 7, así que me imagino que el error será en versiones anteriores.
el código CSS es este:
<code>
#horizon
{
color: white;
background-color: transparent;
text-align: center;
position: absolute;
top: 50%;
left: 0px;
width: 100%;
height: 1px;
overflow: visible;
visibility: visible;
display: block
}
#content
{
font-family: Verdana, Geneva, Arial, sans-serif;
background-color: transparent;
margin-left: -125px;
position: absolute;
top: -35px;
left: 50%;
width: 250px;
height: 70px;
visibility: visible
}
</code>
y después:
<code>
<div id="horizon">
<div id="content"></div>
</div>
</code>
pues eso, que esta parece ser ahora la mejor solución, ya sólo quedan el Konqueror y el NS4... :D
cbp
gracias, txuma :) pero la solución que proponen es la misma que en tierradenomadas, posicionamiento absoluto del 50% en top y left, y unos márgenes negativos que sean la mitad del ancho y alto del <div>. funciona muy bien, pero el problema aparece en NS4, Opera 6 y Konqueror. estoy tratando de buscar una solución limpia y aplicable a la mayoría de nabegadores para ambos centrados pero esta es la mejor que encuentro.
p.s.: no, perdón, me he equivocado, el top no lo ponen a 50% sino a la mitad del alto del <div>, y no usan el margin-top. no sé si esto seguirá ocasionando los mismos problemas que la otra solución :?
p.s.2: qué jodíos, meten los contenidos dentro de un <div> de 1px y que está situado al 50% del top, y a partir de ahí posicionan la cajita roja con valores negativos del top. ¿funcionará bien en todos los navegadores...?
txuma Plus
Todavía no le he dado un vistazo a fondo, pero por si sirve de ayuda para el centrado, aquí va esta página:
http://www.wpdfd.com/editorial/thebox/deadcentre4.html
cbp
este es el HTML...
<code>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="es-ES" lang="es-ES">
<head>
<title>prueba</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<link rel="stylesheet" media="screen, tv" type="text/css" href="css/estilos.css" />
<script src="js/IEmarginFix.js" type="text/javascript"></script>
</head>
<body>
<div class="caja_contenidos">aquí van los contenidos</div>
</body>
</html>
</code>
y este el CSS...
<code>
body {
margin:0;
padding:0;
overflow:hidden;
}
.caja_contenidos {
width:500px;
height:300px;
margin:auto;
background-color:#cc0000;
}
</code>
de momento de me lo centra bien en horizontal en IE, NS, Mozilla y Opera. ahora tengo que centrarlo en vertical. me dijiste que lo hiciera con js, ¿capturo el espacio con document.body.clientHeight, lo resto a la altura del div y lo posiciono con document.getElementById.style.top?
p.s.: acabo de descubrir en MAX DESIGN que el centrado horizontal que usa el margin:auto también da problemas en NS4, con lo cual la única diferencia de accesibilidad con el método que usa márgenes negativos es el Opera 6 y el Konqueror. además, propone una solución alternativa al uso del fix para IE, y es añadir un "text-align: center" en el body y un "text-align: left" en el div. si esto funciona, me parece una solución más elegante que usar el fix de David Schontzler. ¿qué opinas, meddle? :)
meddle
los que no soporten js no centraran la capa.
cbp
¿y los que no soporten javascript? jo, esto de la accesibilidad es un lío, yo me vuelvo a mi IE6 y mi NS7 y ya está ;)
meddle
ya, nadie usa ns4 pero una cosa es que no se vea como esta pensado que se vea y otra es putear. claro que poniendo @import ns4 no verá la css y por tanto vera el contenido sin estilos. arreglado.
en cuanto al margin:auto + fix funcionara correctamente en todos los navegadores que soporten margin:auto (ademas de arreglar el problema del IE). Pero margin:auto no centra verticalmente, solo en horizontal. Para centrados verticales puedes hacer una mezcla de margin: auto para horizontal y margenes negativos para vertical o bien usar directamente javascript y listos (que <em>en este caso</em> creo que es lo mas adecuado)
cbp
meddle
pues leete los comentarios de ese tutorial :)
ok, es decir, que los problemas aparecen con el NN4, y menor medida con Opera 6 y Konqueror, entonces no pasa nada, si nadie los usa, hombre... ;)
si pongo el @import me evito el problema del NN4, ya que no reconoce esa regla, ¿no? ¿y entonces qué pasa con sus usuarios? ¿y si uso margin:auto con el bug para IE funcionaría correctamente? siento hacer tantas preguntas, pero es lo malo de empezar :oops:
meddle
cbp
ya, ya recuerdo que no lo aconsejabas en el post, pero estuve viendo un tutorial en tierradenomadas en el que los utilizaban y lo que he probado de momento funciona bien.
pues leete los comentarios de ese tutorial :)
black
cbp
<div class="quote">
black
<blockquote>... para verlos en directo con videoproyecciones... increíbles!</blockquote>
</div>
¿llevan videoproyecciones? ¿hexstatic vs mogwai? moooooooooooooola
más "urbanas..." luces nocturnas, lluvia y tal... :)
Se nos ha ido el tema del post... :) sorry...
cbp
meddle
si, pero yo te desaconsejo lo de los margenes negativos.
ya, ya recuerdo que no lo aconsejabas en el post, pero estuve viendo un tutorial en tierradenomadas en el que los utilizaban y lo que he probado de momento funciona bien.
cbp
black
... para verlos en directo con videoproyecciones... increíbles!
¿llevan videoproyecciones? ¿hexstatic vs mogwai? moooooooooooooola
black
cbp
dioooooooooooooooooooooooooooos, esta gente controlaaaaaaaaaaaaaaaa !!!
... para verlos en directo con videoproyecciones... increíbles!
meddle
cbp
gracias, meddle :) ¿de esto hablaste no hace demasiado en otro post, no? también se hablaba de un método que consistía en poner un margin negativo que fuera la mitad del ancho del div o algo así.
si, pero yo te desaconsejo lo de los margenes negativos.
cbp
dioooooooooooooooooooooooooooos, esta gente controlaaaaaaaaaaaaaaaa !!!
con el primer minuto de "Answer" ya me han ganado, que me voy a ir a verlo, eh, toma ya, el 7 Mogwai y el 14 Mitzura, sobredósis... :D
encima la portada del primer disco mola un montón
p.s. [editado]: !!! "arab" ruleeeeeeeeeeeeeeeeeeees !!! por favor, todo el que lea este post que se meta en la página y se baje los temas y lo flipe, me cago en la leche que descubrimiento... :D gracias black, muchas gracias :D
cbp
jeje, permíteme que dude que sean como Mogwai... ;)
pero tienen muy buena pinta, han grabado algo para Acuarela y todo, eso ya merece un respeto. hay música para bajarse, voy a probar a ver qué tal, para que luegan digan que internet no contribuye a la democratización...
el 14 de febrero están aquí, como me gusten me acerco, hombre
p.s.: el post se nos va de las manos, antes de que aparezca orange deberíamos abrir uno en música para seguir hablando de esto ;)
black
producto autoctono! :) como mogwai... muy buenos!
www.miztura.com :)
cbp
black
Pos no, no iré... no soy de los que se mueven tanto por un concierto... :) ganas hay pero bueno... me conformaré con Miztura, que creo que tocan por esos días en Donosti... :D
ah, jo, que eres de Donosti... ¿por qué no leeré las fichas antes de hablar...? ahora entiendo que no vengas a verlos, me da a mí pereza tener que coger el metro... aunque si fuera al revés, a lo mejor iba a Donosti y todo, Mogwai me flipan muuuuuuuuuuuuuuuuuuuuuuuuuuuuucho mucho. ya estuve una vez por allí viendo a los Pearl Jam esos, en mis tiempos de grunge. ah, los 90...
a Mitzura no los conozco, ¿están bien?
black
cbp
ten por seguro que iré a verlos, creo que es el grupo que más ganas tengo de ver en directo, cuando veais en las noticias a alguien abrazado a las piernas de cada uno de ellos, ese seré yo ¿tú no vas a verlos?
a mí también me está costando, bueno, me va a costar, aaaaah, el colspan, bendito seas... pero bueno, ahora tendremos otras experiencias nuevas, yo ya le he echado el ojo al "margin:auto", creo que va a ser mi nuevo fetiche ;)
Pos no, no iré... no soy de los que se mueven tanto por un concierto... :) ganas hay pero bueno... me conformaré con Miztura, que creo que tocan por esos días en Donosti... :D
Gracias Maestro Meddle! El otro día intenté alinear mi web así y me lleve una desagradable sorpresa... miro tu link...
cbp
gracias, meddle :) ¿de esto hablaste no hace demasiado en otro post, no? también se hablaba de un método que consistía en poner un margin negativo que fuera la mitad del ancho del div o algo así.
meddle
ojo con el margin:auto, IE (como no...) tiene un bug en algunas versiones, que no centra completamente como es debido. Hay un fix excelente por parte de Dave Schontzler http://www.stilleye.com/temp/marginfix.html
cbp
black
GRASIAS!!! yo me enteré gracias a Txuma! ve de mi parte ver a Mogwai... :)
La verdad es que me está constando (tb es verdad que no me pongo muy en serio...) reconvertirme a las divs y los class.. con lo fácil que eran las table y sus maravillosos colspan="10" :)
ten por seguro que iré a verlos, creo que es el grupo que más ganas tengo de ver en directo, cuando veais en las noticias a alguien abrazado a las piernas de cada uno de ellos, ese seré yo ¿tú no vas a verlos?
a mí también me está costando, bueno, me va a costar, aaaaah, el colspan, bendito seas... pero bueno, ahora tendremos otras experiencias nuevas, yo ya le he echado el ojo al "margin:auto", creo que va a ser mi nuevo fetiche ;)
black
cbp
¿cuando me vais a hacer las pruebas para poder entrar en vuestra hermandad Alfa-Beta-Gamma? ;)
por cierto, black, muy buena tu página. ahí me he enterado de las jornadas de accesibilidad en Madrid y sobre todo del concierto de Mogwai, jeje :D
GRASIAS!!! yo me enteré gracias a Txuma! ve de mi parte ver a Mogwai... :)
La verdad es que me está constando (tb es verdad que no me pongo muy en serio...) reconvertirme a las divs y los class.. con lo fácil que eran las table y sus maravillosos colspan="10" :)
orange
Amen
cbp
ya, si yo también me entero de maravilla con los <table>, he llegado a hacer verdaderas virguerías, y lo más cómodo sería continuar así, total, unas web más o menos con tablas no se van a notar en toda la red. pero si te enteras que una cosa no está bien hecha y aún sigues haciéndola, eso ya no está nada bien, y menos tratándose de tu trabajo. creo que se trata más de una cuestión de honestidad y de gusto por las cosas bien hechas. y si hay que reinventarse como diseñador y recomenzar, pues se hace, que para eso somos jóvenes del siglo XXI :D
mystral
pues yo eso de los estilos lo veo un poco complicao............ Yo sigo usando los maravillsos <table>, y funcionan perfectamente, y por lo menos me entero........ si tuviera que maquetar con css....... ufff.......me muero, seguro........... la culap, de macromedia, como siempre , jajaja
Lo siento, pero soy más visual que picador de código........... de todas formas, buscaré el libro de marras.......... ya me ha picao la curiosidad
cbp
meddle
bueno, siempre se puede hacer menos mal si no es perfecto (ojo que no digo que lo hagas mal, que no lo se, lo digo a raiz de tu comentario) :)
jeje, ya hombre, ya, que no me lo tomaba por el lado negativo. cuando digo que lo hago mal es porque...
- hola, me llamo cbp77 y utilizo <table> para maquetar
- hola cbp77!!!
eso sí, afortunadamente el font hace tiempo que dejé de utilizarlo, jeje. lo malo es que había cosas que desconocía, por ejemplo la diferenciación que debe haber entre estructura y presentación, la semántica del código y más cosas. pero bueno, ahora que lo sé, iré haciendo más limpio y correcto el código poco a poco, ahora soy uno de los vuestros... ("momento Donald Sutherland en "la invasión de los ultracuerpos")
meddle
cbp77
jo, ahora lo malo es que hasta que controle bien y tal y como están las cosas en mi trabajo deberé continuar trabajando de una manera que ya sé que es incorrecta, eso no me gusta. tendré que ir cogiendo práctica con mis trabajillos particulares...
bueno, siempre se puede hacer menos mal si no es perfecto (ojo que no digo que lo hagas mal, que no lo se, lo digo a raiz de tu comentario) :)
cbp
lo sabía, lo sabía !! he reconocido vuestro estilo en la prosa del libro !! ya me estais devolviendo mis 21 euros !! ;)
jo, ahora lo malo es que hasta que controle bien y tal y como están las cosas en mi trabajo deberé continuar trabajando de una manera que ya sé que es incorrecta, eso no me gusta. tendré que ir cogiendo práctica con mis trabajillos particulares...