Tylko drukarka Firefox 1. strona

Question

Pracuję nad przyjaznym drukowaniem css dla strony internetowej. Przegląda/drukuje idealnie w IE, ale Firefox (wersja 3.6) wyświetla tylko podgląd/drukuje pierwszą stronę.

Czy ktoś jest świadomy wszystkiego, co by na ogół to spowodowało? Znaczniki są dość skomplikowane, więc nie jestem pewien, od czego zacząć!

Dzięki.

Edit

Rozwiązanie to tylko pogarszał sprawę.

https://support.mozilla.com/ga-IE/questions/667285#answer-115916

Wygląda drukowanie tylko zasysa FF. Klient nie będzie chciał tego usłyszeć - mam nadzieję, że nie skorzystają z FF!

Answer 1

long-standing bug with printing absolutely-positioned elements została ustalona w Firefoksie 3.

na problemy z brakującymi stronami są śledzone w bug 521204 (patrzeć przez „zależy od” listy). Czy masz ramki lub długie tabele na stronie, którą próbujesz wydrukować?

I tak, drukowanie w Firefoksie jest pod wtórny, przykro, że mają do czynienia z nim ...

Answer 2

Jeśli nie jesteś w stanie przezwyciężyć ograniczenia Firefoksa na druku, można przekonwertować stronę do pliku PDF. Jeśli masz ochotę na taką opcję, bardzo polecam bibliotekę Prince XML. Ma bardzo dobrą obsługę CSS, w tym także nośniki wydruku.

Answer 3

Firefox z pewnością NIE ma żadnego znaczenia. Czasami jednak ściśle przestrzega standardów niż inne przeglądarki. W każdym razie, aby przejść do pościgu, miałem ten sam problem, tj. Firefox drukuje (również podgląd) tylko pierwsze 2 strony raportu wielostronicowego, zbudowanego z długiego stołu, wyprodukowanego przez moją stronę internetową. Po pewnym debugowaniu dowiedziałem się, że uwzględniłem większość zawartości raportu wewnątrz elementu span ze stylem {display: inline-block;} między innymi. Tak szybko, jak usunąłem że stronicowanie było idealne ...

Answer 4

Właśnie się dowiedziałem, że od elementu z

display:inline-block; 

tylko pierwsza strona jest drukowana i everthing jeszcze jest ukryte. ustawienie tego na

display:block; 

było rozwiązaniem w moim przypadku.

Answer 5

Miałem ten sam problem. Okazuje się, że tag root miał na nim display: flex. Po zmianie tego na display: block wyświetliła się reszta treści. Zalecam przejście do drzewa DOM i sprawdzenie każdego atrybutu display.

Answer 6

Jeśli nie chcesz, aby przejść przez cały kod, jest to jedyna rzecz, jaką okazało się, że pracuje dla mnie, nie brudząc się cały mój inny CSS:

@media print { 
    body { 
    overflow: visible !important; 
    } 
} 

Answer 7

próbowałem kilkanaście poprawek do tego i, w końcu, wszystko co było potrzebne:

@media print { 
    body { 
    display: block; 
    } 
} 

Answer 8

miałem ten sam problem, ponieważ height z body jest ustawiony na 100% po i zmodyfikowane do height: auto w moim print.css, to działało.

@media print { 
    body { 
    height: auto; 
    } 
} 

Answer 9

Po wielu badań i prób & błędu, znalazłem this article przez siebie listy. Byłem sceptyczny, ponieważ jest tak stary, ale stwierdza, że:

Jeśli element pływający przebiega poza spód drukowanej strony, reszta pływaka skutecznie zniknie, ponieważ nie będzie drukowana na następnej stronie strona.

Ponieważ mam duży pływający pojemnik, pomyślałem, że spróbuję. Tak, zrobiłem mieszankę z innymi odpowiedziami, a ten artykuł i podszedł z tym:

body { 
    overflow: visible !important; 
    overflow-x: visible !important; 
    overflow-y: visible !important; 
} 

/*this is because I use angular and have this particular layout*/ 
body > .fade-ng-cloak { 
    height: 100%; 
    display: block; 
    flex: none; 
    float: none; 
} 
.l-content, 
.l-sidebar { 
    float: none; 
} 

więc zasadniczo:

1. Ustawienie ciała overflow: visible
2. elementów ustawienie, które zachowują się jak owijarki do display: block, wyeliminować wszystkie flex style iw razie potrzeby przywrócić wysokość
3. wyeliminowanie float na długich pojemnikach

Ten mix działał dla mnie! Jestem bardzo szczęśliwy, że pomyślałem, że będę się dzielić :)

Answer 10

Miałem ten sam problem i zastąpiłem pozycję z position:relative na position: absolute z height: 100% z góry div na dół.