To jest błąd IE7:

Mam kawałek stołu, który przesuwam do innego <tbody>. Ok, problem polega na tym, że wewnątrz komórek mam pozycję: względną; div i wewnątrz tego div mam kilka innych divów position:absolute;.

Chodzi o to, że są one renderowane tak, jakby nadrzędny div nie był position:relative, czyli całkowicie w lewym górnym rogu ekranu. CZEMU?!?!

W ff, chrome działa dobrze, ale w IE7 otrzymuję te denerwujące rzeczy. Próbowałem wszędzie umieścić hasLayout, ale to po prostu nie działa.

Oto co mam:

<table>
    <thead></thead>
    <tbody id="mtbody">
    </tbody>
</table>

A oto co otrzymuję i wciskam do "mtbody" (przykład):

<table id="testando">
<tr>
        <td hasLayout="true" class="uhr sl" colspan="7" style="border-bottom: dashed 1px #dddddd; background-color: #eeffee;">
            <div style="overflow: hidden;" class="holdU" hasLayout="true" betriebsId="83113" betriebsName="2nd Level">
                <div hasLayout="true" class="uhr filled0sl" style="width: 679px; left: 0px;">
                </div>


                    <div hasLayout="true" class="border" style="left: 96">
....

Tak więc klasa „holdU” to position:relative, a klasy „uhr” to position: absolute i są teraz w moim lewym górnym rogu, jakoś niewidoczne.

Jak mogę to naprawić?

AKTUALIZACJA:

Tak więc zasadniczo jest to oczekiwany wynik: http://jsfiddle.net/kgT6E/ (od DanielB). Ale tego NIE rozumiem. Wyobraź sobie, że ten zielony kwadrat jest teraz oddalony o 100 pikseli od granic, ale zamiast zawijać czerwone kwadraty, pozostają one w lewym górnym rogu, ponieważ pozycja: względem zielonego kwadratu nie daje żadnego efektu.

Oto kod, którego używam do ładowania rzeczy do tabeli:

$.get(savedUrl, function(res) {
        var div = $("<div>").html(res);
// this is because I get other stuff together, but what I really want is the tbody content.
        $("#mtbody").html($(div.find("tbody").get(0)).html());
});

Wcześniej ładowałem wszystko do tbody, $("#mtbody").load(savedUrl)

Ale IE7 nie rozpoznawał TR i TD, więc musiałem zawinąć je w stół. Teraz otrzymuję to dziwne pozycjonowanie z pozycji position:absolute divs.

UPDATE2: Próbowałem umieścić wszystkie jednostki (23 px), ale jak dotąd bez powodzenia. Myślę, że to dlatego, że muszę najpierw zapakować go w div, a kiedy to robię, pozycje nie są aktualizowane.. naprawdę dziwny i paskudny błąd z IE.. =/

0
José Leal 27 czerwiec 2011, 18:50
1
Czy możesz podać prosty przykład, który demonstruje to zachowanie na jsfiddle.net?
 – 
StriplingWarrior
27 czerwiec 2011, 18:57

2 odpowiedzi

Najlepsza odpowiedź

Więc po kopaniu trochę znalazłem bardzo paskudny "float: left" w stylu div.uhr. Zasadniczo to zepsuło cały układ w IE7, powodując, że div z "position:absolute" pojawiły się z ekranu.

Więc ludzie, uważajcie na to! ;D

0
José Leal 29 czerwiec 2011, 13:44

To nie jest błąd IE7. Jeśli Twój kod HTML i CSS jest prawidłowy, to działa.

Spójrz na ten przykład.

Nie powinieneś również umieszczać <table> w <tbody>. <tbody> powinien mieć tylko <tr> dzieci.

Edytować

Również w definicji stylu wbudowanego brakuje jednostki miary.

<div hasLayout="true" class="border" style="left: 96">

Powinien być

<div hasLayout="true" class="border" style="left: 96px">
2
Community 20 czerwiec 2020, 12:12
Być może możesz umieścić swój kompletny kod HTML na skrzypcach.
 – 
DanielB
27 czerwiec 2011, 19:32
Ale w twoim arkuszu stylów div.uhr nie ma position: relative absolutnego.
 – 
DanielB
27 czerwiec 2011, 20:01
Tak, ale fill1 i fill1sl dodają te właściwości.. =/
 – 
José Leal
28 czerwiec 2011, 12:20
Ok, przepraszam, ale opublikowany przez Ciebie kod nie jest dobrze sformatowany pod kątem czytelności. Jak widać na moim przykładzie, będzie działać w IE7. Powinieneś uprościć swój kod krok po kroku i zobaczyć, w którym momencie się psuje. Czy masz na swojej stronie definicję doctype?
 – 
DanielB
28 czerwiec 2011, 12:27
Tak wiem, pracuję nad tym. Rzecz w tym, że jestem naprawdę sfrustrowany, ponieważ mam tonę rzeczy zrobionych w chrome i firefox, a teraz IE staje mi na drodze. W każdym razie postaram się to rozebrać część po części. Dziękuję! ;D
 – 
José Leal
28 czerwiec 2011, 16:55