Проблем с overflow:hidden във Firefox

misho

Registered
Искам да сложа една голяма снимка в един по-малък div, който е с различни размери според случая. Целта е в зависимост от размерите на div-а да се вижда само част от снимката. За това му дадох overflow:hidden и всичко е прекрасно в Chromium, но във Firefox снимката изкача над div-а. :lol:
Ето пример: http://micobg.net/overflow/overflow.html
Как да реша този проблем?

При свиване на прозореца можете да видите каква ми е целта - снимката да запълва всичкото свободно вляво място , независимо от резолюцията.
 
M1tq96 каза:
задай на снимката position:absolute; :D :D
Така снимката изчезва. :shock:
А и нали на div-а, съдържащ снимката съм дал position:absolute;.
 
overflow не ти работи, защото трябва да дадеш височина на родителския елемент (в случая div).
Също така махни това position:absolute; това е голяма глупост :)
Няма нужда да слагаш и width:100%; защото по подразбиране всеки див запълва 100% от ширината на родителския елемент.

Т.е. кода трябва да стане така:

[css]#hello_img {
height:350px;
overflow: hidden;
}[/css]
 
Хубавото е, че вече и под двата браузъра е едно и също.
Лошото е, че не е това, което търся. :? Така се вижда цялата снимка и разтяга съдържащите я div-ове не до желаните 100%-350px, а до размерите на снимката. :lol:
 
Реших си проблема. Да споделя и как стана:
На външиния div - #hello_intro:
Код:
position: relative;
overflow: hidden;
На вътрешния div - #hello_img:
Код:
position: absolute;
На снимката - нищо. :wink:
 

Горе