2012-03-17 10 views
11

Dopo aver assegnato un overflow con un valore diverso da visible, tutti i relativi elementi figlio verranno ritagliati. È lo scopo della proprietà di overflow. Tuttavia, devo fare in modo che uno degli elementi figlio sia "fluttuato" e non troncato (come un popup) - solo uno di essi; non tutto. È possibile?Come impedire a un elemento figlio di tagliare se l'overflow del genitore non è visibile?

Prendere come esempio. C'è qualche impostazione CSS che non ritaglia il div giallo, mentre ritaglia l'elemento blu? (Attualmente sono entrambi tagliati)

<div style="position:absolute;width:100px;height:50px;overflow:hidden;border:1px solid black"> 
<div style="top:30px;width:50px;height:100px;background:yellow"> 
</div> 
<div style="position:absolute;left:50px;top:0;width:50px;height:100px;background:blue"> 
</div> 
</div> 

Il codice può essere trovato anche http://jsfiddle.net/kZBxD/

+0

cosa esattamente si vuole? – Jack

+0

Vedere la mia risposta e fammi sapere se ci sono problemi. – w3uiguru

+0

hai bisogno di qualcosa del genere: http://jsfiddle.net/kZBxD/3/ – Jack

risposta

0

provare il violino sotto: il div gialla galleggia al di fuori e blu div è dentro come per il necessario.

http://jsfiddle.net/kZBxD/2/

+0

Grazie. Sfortunatamente, devo anche rendere assoluto il div esterno. Anche il div assoluto nidificato verrà ritagliato: http://jsfiddle.net/kZBxD/2/ –

+0

Ti dispiace aggiungere il codice all'interno della tua risposta? –

4

Avete bisogno di qualcosa di simile:

controllo questo violino: http://jsfiddle.net/kZBxD/3/

<div style="position:absolute;width:100px;height:50px;overflow:hidden;border:1px solid black"> 
<div style=" position:fixed;width:50px;height:100px;background:yellow"></div> 

+2

Grazie. Sì, la posizione fissa può risolvere il problema del clipping. Sfortunatamente, non si muoverà quando il suo genitore o la sua finestra scorreranno. È possibile avere entrambi (non clipping e spostamento con genitore)? –

+0

vuoi dire qualcosa del genere? http://jsfiddle.net/kZBxD/4/ – Jack

+0

in realtà non sto capendo quello che vuoi, tutto è possibile – Jack

Problemi correlati