Dlaczego ta strona łamanie układ gdy ogniwo kotwica służy

Question

mojej stronie http://dl.dropbox.com/u/49912546/anchor_link_test.htm wyświetla się inaczej, gdy kotwica jest używany zbyt http://dl.dropbox.com/u/49912546/anchor_link_test.htm#vanquish-s - zawartość poniżej obrazu jest przesuwany w górę nieznacznie

Dzieje się konsekwentnie w różnych przeglądarkach, więc nie musi być coś w specyfikacji, co oznacza, że ​​to jest prawidłowe zachowanie ... ale co? Dzieje się tak tylko wtedy, gdy obraz jest wczytywany (jeśli src jest nieprawidłowy, błąd nie występuje).

* edytuj Przy okazji, znalazłem obejście już http://dl.dropbox.com/u/49912546/anchor_link_test_solved.htm#vanquish-s, więc nie szukam poprawki błędu - chcę tylko wiedzieć, dlaczego wszystkie przeglądarki mają implementacje CSS, które powodują to zachowanie.

Answer 1

half content pojawia się przesunięcie w górę ze względu na .panel jego umieszczone jest na overflow:hidden & zawiera treści zaciśnięcia w wyniku.

Gdy przeglądarka próbuje zidentyfikować element w nazwanej kotwicy, widzi to w kontenerze, który może przyciąć jego treść &, więc przewija ten element do góry, aby zapewnić jego widoczność.

Na przykład, jeśli były, aby dodać wszystkie elementy wewnątrz contentInner ale przede nazwanego h3, wtedy nie będzie widoczny na stronie przy nazwie kotwica została wykorzystana jako half content przewijane są takie, że h3 jest na górze. (Ten sam wynik jak gdyby overflow:scroll zostały zastosowane; nazwany kotwica powoduje, że pasek przewijania, aby ustawić się w linii z góry o nazwie elementu)

Answer 2

W moim przypadku usuwania overflow: hidden pracował

#maincontent { 
    width: 100%; 
    background: transparent; 
    /* overflow: hidden; */ 
    clear:both; 
}