Foros del Web » Creando para Internet » CSS »

problema simple en el DW

Estas en el tema de problema simple en el DW en el foro de CSS en Foros del Web. tengo una img que le puse unos hipervinculos y se me desarmo todo :( quiero que se vea asi: pero cuando le pongo los hipervinculos ...
  #1 (permalink)  
Antiguo 18/09/2009, 16:00
 
Fecha de Ingreso: septiembre-2009
Mensajes: 35
Antigüedad: 8 años, 3 meses
Puntos: 1
problema simple en el DW

tengo una img que le puse unos hipervinculos y se me desarmo todo :(

quiero que se vea asi:



pero cuando le pongo los hipervinculos se ve asi:



eso que se ve ahi que se sale es donde estan los hipervinculos, y nose como "encajarlos" aca les dejo el html que estoy usando, espero que me puedan ayudar porque ya estoy con esto asi--->

Código HTML:
<style> 
.mygen { Background Properties }
table, tr, td { background-color:transparent; border:none; border-width:0;}
body {
background-repeat:repeat;margin-top:340px;
}
 
div.topbanner {
position: absolute;
top: 0;
left: 50%;
margin-left: -431px;
text-align:left;
width: 862px;
height: 340px;
z-index: 1;
}
 
 
</style> 
 
<div class="topbanner"><center><img src="http://gastonlaterza.com.ar/images/cabeza-myspace_01.png" alt="" width="859" height="226" /></a><img src="http://gastonlaterza.com.ar/images/cabeza-myspace_02.png" border="0" alt="" /><a><img src="http://gastonlaterza.com.ar/images/cabeza-myspace_08.png" alt="" width="292" height="90" class="topbanner" /><a><img src="http://gastonlaterza.com.ar/images/cabeza-myspace_09.png" alt="" width="92" height="77" class="topbanner" /><a><img src="http://gastonlaterza.com.ar/images/cabeza-myspace_07.png" alt="" width="136" height="108" class="topbanner" /></a></a></a></a><a href="http://www.msplinks.com/MDFodHRwOi8vbWVzc2FnaW5nLm15c3BhY2UuY29tL2luZGV4LmNmbT9mdXNlYWN0aW9uPW1haWwubWVzc2FnZSZmcmllbmRJRD0xMTU5ODM5MjQ="><a href="http://www.msplinks.com/MDFodHRwOi8vZnJpZW5kcy5teXNwYWNlLmNvbS9pbmRleC5jZm0/ZnVzZWFjdGlvbj1pbnZpdGUuYWRkZnJpZW5kX3ZlcmlmeSZmcmllbmRJZD0xMTU5ODM5MjQ="><img src="http://gastonlaterza.com.ar/images/add.png" alt="add" border="0" class="topbanner" /></a><img src="http://gastonlaterza.com.ar/images/message.png" alt="message" width="98" height="18" border="0" class="topbanner" /></a><a href="http://www.msplinks.com/MDFodHRwOi8vY29tbWVudC5teXNwYWNlLmNvbS9pbmRleC5jZm0/ZnVzZWFjdGlvbj11c2VyLnZpZXdQcm9maWxlX2NvbW1lbnRGb3JtJmZyaWVuZElEPTExNTk4MzkyNA=="><img src="http://gastonlaterza.com.ar/images/comment.png" alt="comment" width="153" height="18" border="0" /></a><a href="http://www.msplinks.com/MDFodHRwOi8vd3d3LmZhY2Vib29rLmNvbS9wYWdlcy9HYXN0b24tTGF0ZXJ6YS8yOTMwNzM2MzIxMD9yZWY9dHM=" target="_blank"><img src="http://gastonlaterza.com.ar/images/facebook.png" alt="" width="92" height="31" border="0" class="topbanner" /></a><a><img src="http://gastonlaterza.com.ar/images/spacer.gif" width="1" height="18" alt="" /><img src="http://gastonlaterza.com.ar/images/spacer.gif" width="1" height="13" alt="" /></a><img src="http://gastonlaterza.com.ar/images/spacer.gif" width="1" height="77" alt="" /></a> 
</div> 
  #2 (permalink)  
Antiguo 18/09/2009, 16:34
Avatar de abimaelrc
Colaborador
 
Fecha de Ingreso: mayo-2009
Ubicación: En el planeta de Puerto Rico
Mensajes: 14.728
Antigüedad: 8 años, 6 meses
Puntos: 1512
Respuesta: problema simple en el DW

Ok, antes de seguir con lo que quieres hacer con CSS, porque no colocas todo como una imagen y usas el map para usar los links. Con el dreamweaver selecciona la imagen y mira abajo que te va a salir un campo de map. Ahi puedes seleccionar especificamente el lugar de la imagen que quieres convertir a link.

PD: Te sugiero tambien instalar un buen editor llamado Notepad++ para que te ayude con los codigos, en vez de usar Notepad regular.
__________________
Verifica antes de preguntar.
Los verdaderos amigos se hieren con la verdad, para no perderlos con la mentira. - Eugenio Maria de Hostos
  #3 (permalink)  
Antiguo 18/09/2009, 16:58
Avatar de alexk
Colaborador
 
Fecha de Ingreso: julio-2009
Ubicación: De vuelta al trono
Mensajes: 1.697
Antigüedad: 8 años, 5 meses
Puntos: 137
Respuesta: problema simple en el DW

<center>??? (margin:0 auto;)

No le dejes un "agujero" en blanco a la imagen" simplemente con tu editor quita los links... y en el div que sobrepones ali deja las iamgenes... es importante la posicion "relativa" (ya que sino flotara) darsela al contenedor que tiene a la "imagen" y a los links

intenta lo que te indica abimaelrc...

sino podrias poner el ejemplo online para ver que pasa... chao!
  #4 (permalink)  
Antiguo 18/09/2009, 21:51
 
Fecha de Ingreso: septiembre-2009
Mensajes: 35
Antigüedad: 8 años, 3 meses
Puntos: 1
Respuesta: problema simple en el DW

Cita:
Iniciado por abimaelrc Ver Mensaje
Ok, antes de seguir con lo que quieres hacer con CSS, porque no colocas todo como una imagen y usas el map para usar los links. Con el dreamweaver selecciona la imagen y mira abajo que te va a salir un campo de map. Ahi puedes seleccionar especificamente el lugar de la imagen que quieres convertir a link.

PD: Te sugiero tambien instalar un buen editor llamado Notepad++ para que te ayude con los codigos, en vez de usar Notepad regular.
entiendo lo que decis y lo de los map es lo mejor sin duda, y es lo 1ro que intente hacer, pero como explicarte lo que me paso... mira te hice un video tutorial con lo que me pasa cuando aplico map


http://rapidshare.com/files/28202428...e-clip0002.rar (1mb)
  #5 (permalink)  
Antiguo 19/09/2009, 00:42
Avatar de abimaelrc
Colaborador
 
Fecha de Ingreso: mayo-2009
Ubicación: En el planeta de Puerto Rico
Mensajes: 14.728
Antigüedad: 8 años, 6 meses
Puntos: 1512
Respuesta: problema simple en el DW

Iiiiccchh, ahora existe video-tutoriales de problemas (solo te falto el audio ) Bueno, puedes hacerlo de esta forma. Yo use la imagen que tienes arriba, trata a ver si te funciona de esta forma. Hace 545487874 que no uso myspace, así que no se decirte si funciona.
Código html:
Ver original
  1. #contenedor{width: 860px;}
  2. #contenedor a{text-decoration: none;}
  3. #contenedor span{
  4.     position: relative;
  5.     top: -105px;
  6.     left: 288px;
  7.     z-index: 5;
  8.     padding: 0 8px;
  9. }
  10. <div id="contenedor">
  11.     <img src="c.gif" border="0" />
  12.     <span><a href="www.google.com">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</a></span>
  13.     <span><a href="www.forosdelweb.com">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</a></span>
  14.     <span><a href="www.myspace.com">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</a></span>
  15.     <span><a href="www.facebook.com">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</a></span>
  16. </div>
__________________
Verifica antes de preguntar.
Los verdaderos amigos se hieren con la verdad, para no perderlos con la mentira. - Eugenio Maria de Hostos

Última edición por abimaelrc; 19/09/2009 a las 00:55
  #6 (permalink)  
Antiguo 19/09/2009, 04:47
 
Fecha de Ingreso: septiembre-2009
Mensajes: 35
Antigüedad: 8 años, 3 meses
Puntos: 1
Respuesta: problema simple en el DW

no funciono :(

mira te lo explico mejor amigo

http://rapidshare.com/files/282126658/clip0003.rar (5mb)
  #7 (permalink)  
Antiguo 19/09/2009, 09:16
Avatar de abimaelrc
Colaborador
 
Fecha de Ingreso: mayo-2009
Ubicación: En el planeta de Puerto Rico
Mensajes: 14.728
Antigüedad: 8 años, 6 meses
Puntos: 1512
Respuesta: problema simple en el DW

Bueno en realidad funciona lo de los links porque yo solo trabaje con el div. El problema es que quieres colocarlo en la parte de arriba del myspace y centralizado. Ahi va a tener que indicarte alguien como usar el codigo que te di, pero colocarlo donde tu quieres.
__________________
Verifica antes de preguntar.
Los verdaderos amigos se hieren con la verdad, para no perderlos con la mentira. - Eugenio Maria de Hostos
  #8 (permalink)  
Antiguo 19/09/2009, 14:52
 
Fecha de Ingreso: septiembre-2009
Mensajes: 35
Antigüedad: 8 años, 3 meses
Puntos: 1
Respuesta: problema simple en el DW

con lo que me pasate amigo si le hago una vista previa en el dreamwever anda bien, pero cuando lo aplico en el myspace no hace los hipervinculos... y como vos bien dijiste tampoco va al encabezado del myspace

lo que no entiendo es como hizo esta persona para hacerlo, ya que se ve un html TAN simple!!!! porque a el le anda y a mi no, este es el myspace de la persona http://www.myspace.com/tsubarecords y este es el codigo que uso mira...

Código html:
Ver original
  1. .mygen { Background Properties }
  2. table, tr, td { background-color:transparent; border:none; border-width:0;}
  3. body {
  4. background-repeat:repeat;margin-top:340px;
  5. }
  6.  
  7. div.topbanner {
  8. position: absolute;
  9. top: 0;
  10. left: 50%;
  11. margin-left: -431px;
  12. text-align:left;
  13. width: 862px;
  14. height: 340px;
  15. z-index: 1;
  16. }
  17.  
  18.  
  19. </style>
  20.  
  21. <div class="topbanner"><center><img src="http://i163.photobucket.com/albums/t310/bobstarwebdesigns/tsuba/tsuba-header2_01.gif" /></a><img src="http://i163.photobucket.com/albums/t310/bobstarwebdesigns/tsuba/tsuba-header2_02.gif" border="0" alt="" /></a><a href="http://www.msplinks.com/MDFodHRwOi8vZnJpZW5kcy5teXNwYWNlLmNvbS9pbmRleC5jZm0/ZnVzZWFjdGlvbj1pbnZpdGUuYWRkZnJpZW5kX3ZlcmlmeSZmcmllbmRJRD03NDEwOTAzOA=="><img src="http://i163.photobucket.com/albums/t310/bobstarwebdesigns/tsuba/tsuba-header2_03.gif" border="0" alt="Add" /></a><a href="http://www.msplinks.com/MDFodHRwOi8vbWVzc2FnaW5nLm15c3BhY2UuY29tL2luZGV4LmNmbT9mdXNlYWN0aW9uPW1haWwubWVzc2FnZSZmcmllbmRJRD03NDEwOTAzOCZNeVRva2VuPTdhZTBlZjdmLTlhYzItNDU3Ni1hMDg4LTM5YjQxNWMyODY2Yw=="><img src="http://i163.photobucket.com/albums/t310/bobstarwebdesigns/tsuba/tsuba-header2_04.gif" border="0" alt="Message" /></a><a href="http://www.msplinks.com/MDFodHRwOi8vY29tbWVudC5teXNwYWNlLmNvbS9pbmRleC5jZm0/ZnVzZWFjdGlvbj11c2VyLnZpZXdQcm9maWxlX2NvbW1lbnRGb3JtJmZyaWVuZElEPTc0MTA5MDM4Jk15VG9rZW49Y2Y3Y2ZiMmEtOGFhMS00YzliLTgwMDAtNmExNTAyYmIxN2Rk"><img src="http://i163.photobucket.com/albums/t310/bobstarwebdesigns/tsuba/tsuba-header2_05.gif" border="0" alt="Comment" /></a><a href="http://www.msplinks.com/MDFodHRwOi8vd3d3LnRzdWJhcmVjb3Jkcy5jb20=" target="_blank"><img src="http://i163.photobucket.com/albums/t310/bobstarwebdesigns/tsuba/tsuba-header2_06.gif" border="0" alt="Website" /></a><img src="http://i163.photobucket.com/albums/t310/bobstarwebdesigns/tsuba/tsuba-header2_07.gif" /></a><img src="http://i163.photobucket.com/albums/t310/bobstarwebdesigns/tsuba/tsuba-header2_08.gif" border="0" alt="" /></a>
  22. </div>

Última edición por x1bsas; 19/09/2009 a las 14:58
  #9 (permalink)  
Antiguo 19/09/2009, 21:39
Avatar de abimaelrc
Colaborador
 
Fecha de Ingreso: mayo-2009
Ubicación: En el planeta de Puerto Rico
Mensajes: 14.728
Antigüedad: 8 años, 6 meses
Puntos: 1512
Respuesta: problema simple en el DW

Pero esta raro, porque lo coloque en mi myspace y a mi me salieron los links.
Por si acaso estoy usando la primera imagen que indicaste, que tiene un ancho de 860px.

Y en esa pagina no solamente es lo que encontraste. Tambien tiene como 4 o 5 <style> antes que modifican myspace.
__________________
Verifica antes de preguntar.
Los verdaderos amigos se hieren con la verdad, para no perderlos con la mentira. - Eugenio Maria de Hostos
  #10 (permalink)  
Antiguo 24/09/2009, 14:08
 
Fecha de Ingreso: septiembre-2009
Mensajes: 35
Antigüedad: 8 años, 3 meses
Puntos: 1
Respuesta: problema simple en el DW

no amigo a mi el codigo que pasaste no me anda nose poque, pero igual me queme un poco las pestañas estos dias con el DW y lo pude lograr!!!!!!!



Código html:
Ver original
  1. .mygen { Background Properties }
  2. table, tr, td { background-color:transparent; border:none; border-width:0;}
  3. body {
  4. background-repeat:repeat;margin-top:340px;
  5. }
  6.  
  7. div.topbanner {
  8. position: absolute;
  9. top: 0;
  10. left: 50%;
  11. margin-left: -431px;
  12. text-align:left;
  13. width: 862px;
  14. height: 340px;
  15. z-index: 1;
  16. }
  17.  
  18.  
  19. <div class="topbanner"><center><table id="Table_01" width="860" border="0" cellpadding="0" cellspacing="0">
  20.     <tr>
  21.         <td colspan="6">
  22.             <img src="http://gastonlaterza.com.ar/images/cabeza-myspace_01.png" width="859" height="226" alt="" /></td>
  23.         <td>
  24.             <img src="http://gastonlaterza.com.ar/images/images/spacer.gif" width="1" height="226" alt="" /></td>
  25.     </tr>
  26.     <tr>
  27.         <td rowspan="3">
  28.             <img src="http://gastonlaterza.com.ar/images/cabeza-myspace_02.png" width="339" height="108" alt="" /></td>
  29.         <td>
  30.             <a href="http://www.msplinks.com/MDFodHRwOi8vZnJpZW5kcy5teXNwYWNlLmNvbS9pbmRleC5jZm0/ZnVzZWFjdGlvbj1pbnZpdGUuYWRkZnJpZW5kX3ZlcmlmeSZmcmllbmRJZD0xMTU5ODM5MjQ=" target="_blank">
  31.                 <img src="http://gastonlaterza.com.ar/images/add.png" width="41" height="18" border="0" alt="" /></a></td>
  32.         <td>
  33.             <a href="http://www.msplinks.com/MDFodHRwOi8vbWVzc2FnaW5nLm15c3BhY2UuY29tL2luZGV4LmNmbT9mdXNlYWN0aW9uPW1haWwubWVzc2FnZSZmcmllbmRJRD0xMTU5ODM5MjQ=" target="_blank">
  34.                 <img src="http://gastonlaterza.com.ar/images/message.png" width="98" height="18" border="0" alt="" /></a></td>
  35.         <td>
  36.             <a href="http://www.msplinks.com/MDFodHRwOi8vY29tbWVudC5teXNwYWNlLmNvbS9pbmRleC5jZm0/ZnVzZWFjdGlvbj11c2VyLnZpZXdQcm9maWxlX2NvbW1lbnRGb3JtJmZyaWVuZElEPTExNTk4MzkyNA==" target="_blank">
  37.                 <img src="http://gastonlaterza.com.ar/images/comment.png" width="153" height="18" border="0" alt="" /></a></td>
  38.         <td rowspan="2">
  39.             <a href="http://www.msplinks.com/MDFodHRwOi8vd3d3LmZhY2Vib29rLmNvbS9wYWdlcy9HYXN0b24tTGF0ZXJ6YS8yOTMwNzM2MzIxMD9yZWY9dHM=" target="_blank">
  40.                 <img src="http://gastonlaterza.com.ar/images/facebook.png" width="92" height="31" border="0" alt="" /></a></td>
  41.         <td rowspan="3">
  42.             <img src="http://gastonlaterza.com.ar/images/cabeza-myspace_07.png" width="136" height="108" alt="" /></td>
  43.         <td>
  44.             <img src="http://gastonlaterza.com.ar/images/spacer.gif" width="1" height="18" alt="" /></td>
  45.     </tr>
  46.     <tr>
  47.         <td colspan="3" rowspan="2">
  48.             <img src="http://gastonlaterza.com.ar/images/cabeza-myspace_08.png" width="292" height="90" alt="" /></td>
  49.         <td>
  50.             <img src="http://gastonlaterza.com.ar/images/spacer.gif" width="1" height="13" alt="" /></td>
  51.     </tr>
  52.     <tr>
  53.         <td>
  54.             <img src="http://gastonlaterza.com.ar/images/cabeza-myspace_09.png" width="92" height="77" alt="" /></td>
  55.         <td>
  56.             <img src="http://gastonlaterza.com.ar/images/spacer.gif" width="1" height="77" alt="" /></td>
  57.     </tr>
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




La zona horaria es GMT -6. Ahora son las 11:01.