LOG IN
Usuario:

Contraseña:


Últimos temas
» [PHPBB3] Tema Ubuntu
Como mover tablas dentro de tablas? EmptyMar Feb 27, 2024 10:22 am por hoanglongnhatbao

» [PHPBB3] Fondo y otros efectos al texto llamado "Por X" debajo de los titulos de los post.
Como mover tablas dentro de tablas? EmptyMar Mayo 30, 2023 8:52 am por hoanglongnhatbao

» Skin: Academy [Adaptado por: 15-tronos]
Como mover tablas dentro de tablas? EmptyMar Mayo 30, 2023 8:47 am por hoanglongnhatbao

» [PHPBB3] KN-Anime - VAngel.
Como mover tablas dentro de tablas? EmptyMar Mayo 30, 2023 8:46 am por hoanglongnhatbao

» [PHPBB3] Element Professional Style
Como mover tablas dentro de tablas? EmptyMar Mayo 30, 2023 8:45 am por hoanglongnhatbao

» Menu minimalista
Como mover tablas dentro de tablas? EmptyMar Mayo 30, 2023 8:44 am por hoanglongnhatbao

» [Todas] Efecto Slider Transition en el Logo
Como mover tablas dentro de tablas? EmptyMar Mayo 30, 2023 8:43 am por hoanglongnhatbao

» [PHPBB3] Mejores Posteadores flotantes.
Como mover tablas dentro de tablas? EmptyMar Mayo 30, 2023 8:41 am por hoanglongnhatbao

» [phpbb3] Agrandar el nombre de usuario en el perfil
Como mover tablas dentro de tablas? EmptyMar Mayo 30, 2023 8:41 am por hoanglongnhatbao

Estadísticas
Tenemos 2351 miembros registrados
El último usuario registrado es Jhunky

Nuestros miembros han publicado un total de 41254 mensajes en 3360 argumentos.
Afiliados





No estás conectado. Conéctate o registrate

Ver el tema anterior Ver el tema siguiente Ir abajo  Mensaje [Página 1 de 1.]


1Como mover tablas dentro de tablas? Empty Como mover tablas dentro de tablas? Miér Dic 21, 2011 6:00 am

Ayax

Ayax
Mod.Códigos
Bueno, estoy intentado crear un nuevo menú de navegación que lo emepezé hoy y llevo este código
Código:
<style>
.ayaxregister2:hover{-webkit-transition-duration: 1s;
-moz-transition-duration: 1s;
-o-transition-duration: 1s;
transition-duration: 1s;
background: -moz-linear-gradient(top, #F1F1F1 0%, #F2F2F2 68%, #FEFEFE 100%);
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#F1F1F1), color-stop(68%,#FEFEFE), color-stop(100%,#F1F1F1));
background: -webkit-linear-gradient(top, #F1F1F1 0%,#F2F2F2 68%,#FEFEFE 100%);
background: -o-linear-gradient(top, #F1F1F1 0%,#F2F2F2 68%,#FEFEFE 100%);
background: -ms-linear-gradient(top, #F1F1F1 0%,#F2F2F2 68%,#FEFEFE 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#F1F1F1', endColorstr='#FEFEFE',GradientType=0 );
background: linear-gradient(top, #F1F1F1 0%,#F2F2F2 68%,#FEFEFE 100%);
margin-bottom: 0px; margin: 0px; -webkit-transition-duration: 0.2s;
-moz-transition-duration: 0.2s;
-o-transition-duration: 0.2s;
transition-duration: 0.2s;}
.ayaxregister2 {position: absolute; top: 100px; right: 100px; margin-left: 60px; box-shadow: 1px 1px 6px #919191; border-bottom: 1px ridge #FCFCFC; -webkit-transition-duration: 1s;
-moz-transition-duration: 1s;
-o-transition-duration: 1s;
transition-duration: 1s;padding: 10px; margin-top: 0px; margin-bottom: 0px; background: -moz-linear-gradient(top, #FEFEFE 0%, #F2F2F2 68%, #F1F1F1 100%);
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#FEFEFE), color-stop(68%,#F2F2F2), color-stop(100%,#F1F1F1));
background: -webkit-linear-gradient(top, #FEFEFE 0%,#F2F2F2 68%,#F1F1F1 100%);
background: -o-linear-gradient(top, #FEFEFE 0%,#F2F2F2 68%,#F1F1F1 100%);
background: -ms-linear-gradient(top, #FEFEFE 0%,#F2F2F2 68%,#F1F1F1 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#fefefe', endColorstr='#f1f1f1',GradientType=0 );
background: linear-gradient(top, #FEFEFE 0%,#F2F2F2 68%,#F1F1F1 100%);
border-left: ridge 1px #FCFCFC; border-top: ridge 1px #FCFCFC; margin-bottom: 0px; border-radius: 5px; border-right: 1px ridge #FCFCFC;}
.ayaxregister2 a:hover {text-decoration: none; color: #707070; -webkit-transition-duration: 0.7s;
-moz-transition-duration: 0.7s;
-o-transition-duration: 0.7s;
transition-duration: 0.7s;}
.ayaxregister2 a {color: #292929;text-shadow: 1px 1px 1px white;  font-weight: bold; font-family: tahoma;}
.ayaxlogonav img:hover {opacity: 1;  -webkit-transition-duration: 0.7s;
-moz-transition-duration: 0.7s; -o-transition-duration: 0.7s;
transition-duration: 0.7s;}.ayaxmenu {position: fixed; top: 0px; left: 0px; right: 0px; bottom: 0px; align: center; width: 100%;-webkit-transition-duration: 1s;
-moz-transition-duration: 1s; -o-transition-duration: 1s;
transition-duration: 1s;}.ayaxlogonav img{opacity: 0.8;  -webkit-transition-duration: 0.7s;
-moz-transition-duration: 0.7s; -o-transition-duration: 0.7s;
transition-duration: 0.7s; }.ayaxregister2:hover{-webkit-transition-duration: 1s;
-moz-transition-duration: 1s; -o-transition-duration: 1s;
transition-duration: 1s;background: -moz-linear-gradient(top, #F1F1F1 0%, #F2F2F2 68%, #FEFEFE 100%);
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#F1F1F1), color-stop(68%,#FEFEFE), color-stop(100%,#F1F1F1));
background: -webkit-linear-gradient(top, #F1F1F1 0%,#F2F2F2 68%,#FEFEFE 100%);
background: -o-linear-gradient(top, #F1F1F1 0%,#F2F2F2 68%,#FEFEFE 100%);
background: -ms-linear-gradient(top, #F1F1F1 0%,#F2F2F2 68%,#FEFEFE 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#F1F1F1', endColorstr='#FEFEFE',GradientType=0 );background: linear-gradient(top, #F1F1F1 0%,#F2F2F2 68%,#FEFEFE 100%);margin-bottom: 0px; margin: 0px; -webkit-transition-duration: 0.2s; -moz-transition-duration: 0.2s;-o-transition-duration: 0.2s;transition-duration: 0.2s;}.ayaxregister2 {position: absolute; top: 100px; right: 20px; margin-left: 60px; box-shadow: 1px 1px 6px #919191; border-bottom: 1px ridge #FCFCFC; -webkit-transition-duration: 1s; -moz-transition-duration: 1s;-o-transition-duration: 1s;transition-duration: 1s;padding: 10px; margin-top: 0px; margin-bottom: 0px; background: -moz-linear-gradient(top, #FEFEFE 0%, #F2F2F2 68%, #F1F1F1 100%);background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#FEFEFE), color-stop(68%,#F2F2F2), color-stop(100%,#F1F1F1));background: -webkit-linear-gradient(top, #FEFEFE 0%,#F2F2F2 68%,#F1F1F1 100%);background: -o-linear-gradient(top, #FEFEFE 0%,#F2F2F2 68%,#F1F1F1 100%);background: -ms-linear-gradient(top, #FEFEFE 0%,#F2F2F2 68%,#F1F1F1 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#fefefe', endColorstr='#f1f1f1',GradientType=0 );background: linear-gradient(top, #FEFEFE 0%,#F2F2F2 68%,#F1F1F1 100%);border-left: ridge 1px #FCFCFC; border-top: ridge 1px #FCFCFC; margin-bottom: 0px; border-radius: 5px; border-right: 1px ridge #FCFCFC;}.ayaxregister a:hover {text-decoration: none; color: #707070; -webkit-transition-duration: 0.7s;
-moz-transition-duration: 0.7s;
-o-transition-duration: 0.7s;
transition-duration: 0.7s;}
.ayaxregister a {color: #292929;text-shadow: 1px 1px 1px white;  font-weight: bold; font-family: tahoma;}
.ayaxlogonav img:hover {opacity: 1;  -webkit-transition-duration: 0.7s;
-moz-transition-duration: 0.7s;
-o-transition-duration: 0.7s;
transition-duration: 0.7s;}

.ayaxlogout {float: right; top: 0px;}
.ayaxtable{ padding-right: 20px;  box-shadow: inset -4px -2px 10px black; top: 0px; left: 0px;width: 100%; padding-left: 10px; background-image: url(http://i42.servimg.com/u/f42/15/92/96/93/top_bg10.png); border-bottom: 5px solid #0052a6;}
.ayaxtable:hover{top: -30;}
.ayaxnavbac {text-align: center; align: center; width: 100%; border-bottom: 2px solid #919191;  border-right: 2px solid #919191; border-left: 2px solid #919191; box-shadow: 0px 0px 10px black; border-top: 3px solid #00526; border-radius: 0px 0px 5px 5px;background: url(http://i42.servimg.com/u/f42/15/92/96/93/ayaxba11.png) repeat-x; height: 30px; bottom: 0px; margin-top: 0px; }

.ayaxposition {float: right; top: 100px; right: 200px;}
.ayaxnav2 {align: center; text-align: center;border-right: 1px ridge #919191; padding-top: 2px; padding-left: 10px; padding-right: 10px; margin-bottom: 0px; height: 30px; text-transform: uppercase; font-family: tahoma; font-weight: bold; align: center; text-align: center;"}
.ayaxnav2:hover {text-align: center; box-shadow: inset: 0 0 8px white; -webkit-transition-duration: 0.2s;
-moz-transition-duration: 0.2s;
-o-transition-duration: 0.2s;
transition-duration: 0.2s;color: black; text-shadow: 1px 2px 1px #919191;  border-left: 3px ridge #919191; border-right: 3px groove #919191;; background: url(http://i42.servimg.com/u/f42/15/92/96/93/backgr10.png) repeat-x;}
.ayaxnav2 a{ text-align: center;text-shadow: 1px 1px 1px #919191; color: white; }
.ayaxnav2 a:hover {text-shadow: 1px 1px 1px black; color: black;}
.ayaxregister:hover{-webkit-transition-duration: 1s; -moz-transition-duration: 1s;-o-transition-duration: 1s;
transition-duration: 1s;background: -moz-linear-gradient(top, #F1F1F1 0%, #F2F2F2 68%, #FEFEFE 100%);
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#F1F1F1), color-stop(68%,#FEFEFE), color-stop(100%,#F1F1F1));
background: -webkit-linear-gradient(top, #F1F1F1 0%,#F2F2F2 68%,#FEFEFE 100%);
background: -o-linear-gradient(top, #F1F1F1 0%,#F2F2F2 68%,#FEFEFE 100%);
background: -ms-linear-gradient(top, #F1F1F1 0%,#F2F2F2 68%,#FEFEFE 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#F1F1F1', endColorstr='#FEFEFE',GradientType=0 );
background: linear-gradient(top, #F1F1F1 0%,#F2F2F2 68%,#FEFEFE 100%);
margin-bottom: 0px; margin: 0px; -webkit-transition-duration: 0.2s;
-moz-transition-duration: 0.2s;-o-transition-duration: 0.2s;transition-duration: 0.2s;}.ayaxregister {position: absolute; top: 100px; right: 20px; margin-left: 60px; box-shadow: 1px 1px 6px #919191; border-bottom: 1px ridge #FCFCFC; -webkit-transition-duration: 1s;
-moz-transition-duration: 1s; -o-transition-duration: 1s;transition-duration: 1s;padding: 10px; margin-top: 0px; margin-bottom: 0px; background: -moz-linear-gradient(top, #FEFEFE 0%, #F2F2F2 68%, #F1F1F1 100%);background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#FEFEFE), color-stop(68%,#F2F2F2), color-stop(100%,#F1F1F1));background: -webkit-linear-gradient(top, #FEFEFE 0%,#F2F2F2 68%,#F1F1F1 100%);background: -o-linear-gradient(top, #FEFEFE 0%,#F2F2F2 68%,#F1F1F1 100%);
background: -ms-linear-gradient(top, #FEFEFE 0%,#F2F2F2 68%,#F1F1F1 100%);filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#fefefe', endColorstr='#f1f1f1',GradientType=0 );background: linear-gradient(top, #FEFEFE 0%,#F2F2F2 68%,#F1F1F1 100%);border-left: ridge 1px #FCFCFC; border-top: ridge 1px #FCFCFC; margin-bottom: 0px; border-radius: 5px; border-right: 1px ridge #FCFCFC;}</style><table  class="ayaxmenu"><td><table class="ayaxtable" height="200px"><td><table class="ayaxlogonav"><td><a href="http://webdesignforo.net"><img src="http://i42.servimg.com/u/f42/15/92/96/93/ayaxlo11.png"></a></td></table><table class="ayaxposition2"><td><table><td><table class="ayaxregister"><td><a href="/logout" >Cerrar sesión</a></td></table><table class="ayaxregister2"><td><a href="profile?mode=editprofile">Mi cuenta</a></td></table></td></table></td></table></td></table><table class="ayaxnavbac"><td><table><td class="ayaxnav2"><a href="/forum">FORO</a></td><td class="ayaxnav2"><a href="/portal">PORTAL</a></td><td class="ayaxnav2"><a href="/gallery">GALERÍA</a></td><td class="ayaxnav2"><a href="FAQ">FAQ</a></td><td class="ayaxnav2"><a href="/search">BUSCAR</a></td><td class="ayaxnav2"><a href="/memberlist">MIEMBROS</a></td><td class="ayaxnav2"><a href="/groups">GRUPOS</a></td><td class="ayaxnav2"><a href="/t1-normas-generales-del-foro">NORMAS</a></td></table></td></table></td></table>
L</br>L</br>L</br>L</br>L</br>L</br>L</br>L</br>L</br>L</br>L</br>L</br>L</br>L</br>L</br>L</br>L</br>L</br>L</br>L</br>L</br>L</br>L</br>L</br>L</br>L</br>L</br>L</br>L</br>L</br>L</br>L</br>L</br>L</br>L</br>L</br>L</br>L</br>L</br>L</br>L</br>L</br>L</br>L</br>L</br>L</br>L</br>

Lo último de L
no es nada xD es solo para poder ver que pasa si bajo en el foro
Bueno acá dejo el link de la página HTML para que vean como vá quedando , por ahora se vé bien en google chrome
http://ttutoriales.activoforo.com/h8-navbar-usuarios
Lo que quiero mover son los dos cuadros de "Cerrar sesión" y "Mi cuenta" y que se separen... hasta intenté crear dos tablas distintas para posicionarlas con "position: absolute; top: 100px; right: 50px; " y a la otra le dí 100px a el right para que se separara pero no pasa nada, que hago mal?
Se pueden correr o no? que tengo hacer para moverlos dentro de la table que es el contenido central?



Última edición por Ayax el Jue Dic 22, 2011 11:15 pm, editado 2 veces

http://biohazard.webmaster-foro.com

2Como mover tablas dentro de tablas? Empty Re: Como mover tablas dentro de tablas? Miér Dic 21, 2011 6:33 am

Tito

Tito
Fundador
lo que pasa es que las dos tablas con position absolute tienen el mismo Right:20px, entonces se pone una arriba de otra.
intenta modificando el css de .ayaxregister cambiandole 20 a 150 por ejemplo

http://www.webdesignforo.net

3Como mover tablas dentro de tablas? Empty Re: Como mover tablas dentro de tablas? Miér Dic 21, 2011 4:15 pm

Ayax

Ayax
Mod.Códigos
Emh... nouh.. si te das cuenta creé dos tablas ayaxregister y el ayaxregister2 para moverlas por separado con los CSS y el class pero no se puede :scratch:

http://biohazard.webmaster-foro.com

4Como mover tablas dentro de tablas? Empty Re: Como mover tablas dentro de tablas? Miér Dic 21, 2011 5:38 pm

Tito

Tito
Fundador
Cómo que no podés?
Debes mover una sola, la otra dejala donde está, porque sino se van a mover juntas y no tendría sentido.

http://www.webdesignforo.net

5Como mover tablas dentro de tablas? Empty Re: Como mover tablas dentro de tablas? Jue Dic 22, 2011 10:00 pm

Ayax

Ayax
Mod.Códigos
xD es obvio , quedaron las tablas así
Código:

<table>
  <td class="ayaxregister1">CONTENIDO</td>
  <td class="ayaxregister2">CONTENIDO</td>
</table>
y lo de los CSS queda así
Código:
<style>
.ayaxregister2 {position: absolute; top: 50px; right: 200px;....}
.ayaxregister1 {position: absolute; top: 50px; right: 20px;...}</Style>
Pero siguen sin moverse... y deberían D:

http://biohazard.webmaster-foro.com

6Como mover tablas dentro de tablas? Empty Re: Como mover tablas dentro de tablas? Jue Dic 22, 2011 10:15 pm

Tito

Tito
Fundador
yo lo hice y funciona, mira:
http://www.webdesignforo.net/h4-codigo

http://www.webdesignforo.net

7Como mover tablas dentro de tablas? Empty Re: Como mover tablas dentro de tablas? Jue Dic 22, 2011 11:15 pm

Ayax

Ayax
Mod.Códigos
xDD Gracias, se me olvidó crear una nueva tabla, los class los ponía en un TD :B, aunque debería aver funcionado igual Como mover tablas dentro de tablas? Ninja

http://biohazard.webmaster-foro.com

8Como mover tablas dentro de tablas? Empty Re: Como mover tablas dentro de tablas? Vie Dic 23, 2011 12:44 am

Aikazen

Aikazen
I ♥ WD
Muevo a soporte resuelto.

http://www.aikayweb.activo.ws

Contenido patrocinado


Ver el tema anterior Ver el tema siguiente Volver arriba  Mensaje [Página 1 de 1.]

Permisos de este foro:
No puedes responder a temas en este foro.