taille iframe pour tenir dans div parent

J'ai le code html suivant:taille iframe pour tenir dans div parent

<html> 
<body> 

<div id="note1" class="note"> 
    <div class="note-header">Note</div> 
    <div class="note-content"></div> 
</div> 

</body> 
</html>

avec css:

body { 
    background-color:black 
} 
.note { 
    width: 150px; 
    height: 150px; 
    background: #111111; 
} 
.note h4 { 
    text-align: center; 
} 
.note-header { 
    background: #0b3e6f; 
    color: #f6f6f6; 
    font-weight: bold; 

} 
.note-content { 
    height: 100%; 
    width: 100%; 
} 
.note-editor { 
    width: 100%; 
    height: 100%; 
}

Et javascript qui ajoute iframe à div.note contenu:

$(function() { 
    $("#note1").resizable().draggable({handle: ".note-header"}); 
    $('#note1').children('.note-content').append('<iframe id="rte" class="note-editor" ></iframe>'); 
    $('#rte').contents().attr("designMode", "on"); 
});

Le problème est que la taille d'iframe semble être plus grande que div.note-contenu taille. Parent div est redimensionnable. comment puis-je adapter iframe au contenu div.note? JSFiche: http://jsfiddle.net/TTSMb/

Source

2010-10-19 Anonymous

Pourquoi ne spécifiez-vous pas une taille sur l'iframe? Cela devrait probablement résoudre votre problème ici

Source

2010-10-19 14:56:51 Claudiu

div parent est redimensionnable, j'aurais dû écrire cela dans ma question ... bien sûr, je peux changer la taille de l'iframe sur div redimensionner, mais je pensais qu'il pourrait y avoir une meilleure solution avec css. –

Et si vous spécifiez la largeur et la hauteur à 100% sur l'iframe? – Claudiu

c'est 100% ... j'ai essayé le faire moins%, mais toujours pas de chance –

Le problème est que l'iframe prend la taille du parent, de classe note-contenu qui prend la taille complète (largeur 100%, hauteur 100%) de sa note parent1. Mais note1 contient aussi une autre div.

Vous devez modifier la hauteur du contenu de la note.

Source

2010-10-19 15:04:13

Je suppose que vous avez raison. mais y a-t-il un moyen de le réparer css-way? –

Je ne sais pas si vous pouvez régler la hauteur à la hauteur restante. Vous pouvez toujours définir le débordement sur caché sur la div de note1, mais cela réduirait l'iframe au lieu de le régler à la bonne taille. Vous pouvez définir manuellement la hauteur de la poignée, de cette façon vous connaissez la hauteur à définir pour le contenu de la note. –

taille iframe pour tenir dans div parent

Répondre

Questions connexes