Foros del Web » Creando para Internet » CSS »

Posicionamiento y desplazamiento de cajas

 Estas en el tema de Posicionamiento y desplazamiento de cajas en el foro de CSS en Foros del Web. Hola amigos soy nuevo en esto del lenguaje Css. Yo quiero que se me estructuren todas ordenadas y que las otras no se muevan pero ...
  #1 (permalink)  
Antiguo 12/12/2013, 21:29
 
Fecha de Ingreso: diciembre-2013
Mensajes: 1
Antigüedad: 11 años
Puntos: 0
Posicionamiento y desplazamiento de cajas
Hola amigos soy nuevo en esto del lenguaje Css.

Yo quiero que se me estructuren todas ordenadas y que las otras no se muevan pero nose porque se me mueven.
Os paso el texto HTML y Css y haber si me podeis ayudar.
Gracias.

Css:

Código CSS: 
Ver original
  1. @charset "UTF-8";
  2. /* CSS Document */
  3. a.Inicio { 
  4. text-decoration:none;
  5. color:#333;
  6. border-style:double;
  7. border-spacing:10px;
  8. padding:7px 20px 7px 20px;
  9. background-color:#CCC;
  10. font-family:Georgia, "Times New Roman", Times, serif;
  11. font-size:16px;
  12. font-weight:500;
  13. border-radius: 50px;
  14. margin-left:20px;
  15. margin-right:20px;
  16. }
  17. a.Productos {
  18. text-decoration:none;
  19. color:#333;
  20. border-style:double;
  21. border-spacing:10px;
  22. padding:7px 20px 7px 20px;
  23. background-color:#CCC;
  24. font-family:Georgia, "Times New Roman", Times, serif;
  25. font-size:16px;
  26. font-weight:500;
  27. border-radius: 50px;
  28. margin-left:20px;
  29. margin-right:20px;
  30. }
  31. a.Ofertas {
  32.     text-decoration:none;
  33. color:#333;
  34. border-style:double;
  35. border-spacing:10px;
  36. padding:7px 20px 7px 20px;
  37. background-color:#CCC;
  38. font-family:Georgia, "Times New Roman", Times, serif;
  39. font-size:16px;
  40. font-weight:500;
  41. border-radius: 50px;
  42. margin-left:20px;
  43. margin-right:20px;
  44. }
  45. a.Packs{
  46.     text-decoration:none;
  47. color:#333;
  48. border-style:double;
  49. border-spacing:10px;
  50. padding:7px 20px 7px 20px;
  51. background-color:#CCC;
  52. font-family:Georgia, "Times New Roman", Times, serif;
  53. font-size:16px;
  54. font-weight:500;
  55. border-radius: 50px;
  56. margin-left:20px;
  57. margin-right:20px;
  58. }
  59. a.Contactos{
  60.     text-decoration:none;
  61. color:#333;
  62. border-style:double;
  63. border-spacing:10px;
  64. padding:7px 20px 7px 20px;
  65. background-color:#CCC;
  66. font-family:Georgia, "Times New Roman", Times, serif;
  67. font-size:16px;
  68. font-weight:500;
  69. border-radius: 50px;
  70. margin-left:20px;
  71. margin-right:20px;
  72. }
  73. a.Inicio:hover{
  74. text-decoration:none;
  75. border-style:double;
  76. padding:7px 20px 7px 20px;
  77. font-family:Georgia, "Times New Roman", Times, serif;
  78. font-style:italic;
  79. color:#31C0E6;
  80. background-color:#000;
  81. }
  82. a.Inicio:active{
  83.     color:#ABEC00;
  84. }
  85. a.Productos:hover{
  86. text-decoration:none;
  87. border-style:double;
  88. padding:7px 20px 7px 20px;
  89. font-family:Georgia, "Times New Roman", Times, serif;
  90. font-style:italic;
  91. color:#31C0E6;
  92. background-color:#000;
  93. }
  94. a.Productos:active{
  95.     color:#ABEC00;
  96. }
  97. a.Ofertas:hover{
  98. text-decoration:none;
  99. border-style:double;
  100. padding:7px 20px 7px 20px;
  101. font-family:Georgia, "Times New Roman", Times, serif;
  102. font-style:italic;
  103. color:#31C0E6;
  104. background-color:#000;
  105. }
  106. a.Ofertas:active{
  107.     color:#ABEC00;
  108. }
  109. a.Packs:hover{
  110. text-decoration:none;
  111. border-style:double;
  112. padding:7px 20px 7px 20px;
  113. font-family:Georgia, "Times New Roman", Times, serif;
  114. font-style:italic;
  115. color:#31C0E6;
  116. background-color:#000;
  117. }
  118. a.Packs:active{
  119.     color:#ABEC00;
  120. }
  121. a.Contactos:hover{
  122. text-decoration:none;
  123. border-style:double;
  124. padding:7px 20px 7px 20px;
  125. font-family:Georgia, "Times New Roman", Times, serif;
  126. font-style:italic;
  127. color:#31C0E6;
  128. background-color:#000;
  129. }
  130. a.Contactos:active{
  131.     color:#ABEC00;
  132. }
  133. a{alignment-adjust:middle;
  134. }
  135. a{position:relative;
  136. left:160px;
  137. }
  138. #contmiformu legend{font-style:italic; font-size:18px; font-family:Verdana, Geneva, sans-serif; color:#7F204C;}
  139. #contmiformu{padding:none; border:none; width:800px; position:relative; top:100px; left:350px;}
  140. #miformu{ width:300px; background-image:linear-gradient(bottom, rgb(102,255,255) 47%, rgb(51,153,255) 68%); background-image:-o-linear-gradient(bottom, rgb(102,102,255) 47%, rgb(51,51,255) 68%); background-color:#3CF; background-image: -webkit-gradient(
  141.  linear,
  142.  left bottom,
  143.  left top,
  144.  color-stop(0.47, rgb(192,204,20)),
  145.  color-stop(0.68, rgb(91,240,126))
  146. );
  147. border-width: 2px;
  148. border-color: #26600c;
  149. border-style: solid;
  150. -moz-border-radius: 15px 15px 15px 15px;
  151. -webkit-border-radius: 15px 15px 15px 15px;
  152. border-radius: 15px 15px 15px 15px;
  153. }
  154.  
  155. #miformu label {
  156.  display: block;
  157.     margin:0;
  158. }
  159.  
  160. #miformu label span {
  161.    display: block;
  162.    margin-left: 7px;
  163. }
  164. #miformu label input {
  165.     margin-left: 40px;
  166.     margin-top: 5px;
  167.     padding-left: 3px;
  168.     border-color: #ff6a00;
  169.     -moz-transition: all .25s; 
  170.     -webkit-transition: all .25s; 
  171.     -o-transition: all .25s;
  172.     transition: all .25s;
  173. }
  174.  
  175. #miformu label textarea {
  176.     margin-left: 40px;
  177.     margin-top: 5px;
  178.     padding-left: 6px;
  179.     border-color: #ff6a00;
  180.     -moz-transition: all .25s; 
  181.     -webkit-transition: all .25s; 
  182.     -o-transition: all .25s;
  183.     transition: all .25s;
  184. }
  185. #miformu label input:focus, #miformu label textarea:focus {
  186.     background: #fff; 
  187.     border-color: #0000FF; 
  188.     box-shadow: 0 0 4px #0000FF; 
  189.     padding-right:65px;
  190.     margin-left: 10px;
  191. }
  192.  
  193. #miformu .submit {
  194.     margin-left: 50px;
  195.     font-size: 14px;
  196.     font-weight: bold;
  197.     padding: 6px;
  198.     margin-bottom: 7px;
  199.     background-color: #808080;
  200.     color: #fff;
  201.     cursor: pointer;
  202.     -moz-transition: all .32s; 
  203.     -webkit-transition: all .32s; 
  204.     -o-transition: all .32s;
  205.     transition: all .32s;
  206.     }
  207.  #miformu .submit:hover {
  208.     padding: 3px 5px;
  209.     background-color: #ebe7e7;
  210.     color: #0000FF;
  211.     }
  212.     embed{position:relative;
  213.     top:200px;
  214.     right:200px;
  215.     }

HTML

Código HTML: 
Ver original
  1. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
  2. <html xmlns="http://www.w3.org/1999/xhtml">
  3. <head>
  4. <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
  5. <title>Inicio</title>
  6. <link href="Estilos.css" type="text/css" rel="stylesheet" />
  7. </head>
  8.  
  9.  
  10. <body>
  11. <img src="Blue Mouse.png" width="1112" height="141"/>
  12. <a href="Inicio.html" class="Inicio">Inicio</a>&nbsp;&nbsp;&nbsp;
  13. <a href="Productos.html" class="Productos">Productos</a>&nbsp;&nbsp;&nbsp;
  14. <a href="Ofertas.html" class="Ofertas">Ofertas</a>&nbsp;&nbsp;&nbsp;
  15. <a href="Packs.html" class="Packs">Packs</a>&nbsp;&nbsp;&nbsp;
  16. <a href="Contacto.html" class="Contactos">Contactos</a>
  17. <embed src="Proyecto nuevo 1.m4v" autostart="true" loop="true"></embed>
  18. </body>
  19. </html>

Mi problema esta que cuando coloco el embed se me mueven los <a> hacia abajo y no quiero que pase eso y no me obedece cuando le pongo valores en top y right.......

Soy novao losiento......
Última edición por pzin; 13/12/2013 a las 01:38 Razón: formato código
  #2 (permalink)  
Antiguo 13/12/2013, 01:42
Avatar de pzin
Moderata 😈
  
Fecha de Ingreso: julio-2002
Ubicación: Islas Canarias
Mensajes: 10.489
Antigüedad: 22 años, 4 meses
Puntos: 2114
Respuesta: Posicionamiento y desplazamiento de cajas
Bienvenido al foro.

La mayor parte de tu código no se va a aplicar porque según los selectores, estás seleccionando enlaces con las clases .Inicio, .Productos, .Ofertas etc que en el HTML no existen.

Yo te recomendaría primero leer y entender algún manual CSS.

Etiquetas: background, cajas, color, desplazamiento, hover, html, posicionamiento
Atención: Estás leyendo un tema que no tiene actividad desde hace más de 6 MESES, te recomendamos abrir un Nuevo tema en lugar de responder al actual.
Respuesta


« Tema Anterior | Próximo Tema »


La zona horaria es GMT -6. Ahora son las 04:55.