Drukowanie strony internetowej.

pytanie zadane 3 sierpnia 2015 w HTML i CSS przez babiak Obywatel (1,810 p.)

Witam,

mam problem z CSS,a mianowicie z @media print. Chcę zrobić wersję strony do wydruku więc wyłączyłem niepotrzebne div-y np. footer, menu itp. A zostawiłem sam div content w którym mam tabelkę. Ta tabelka niekiedy trochę zajmuję - około 500 wierszy i jest w różnych kolorach (zależy od wartości w okienku <td>). W wersji do wydruku cała tabelka ma być po prostu biała i ten efekt uzyskałem jednak nie wszystkie wiersze się ukazują. Zawsze kilku brakuję - nie wiem dlaczego. A ilość brakujących wierszy zależy od orientacji drukowania (pionowa/pozioma). Ma ktoś jakieś pomysły? Załączę kod

    .td_normal, .td_korekta, .td_dodano, .td_anuluj
    {
            background-color: white !important;
            border: 1px solid black;
            font-size: 10px !important;
    }
    
    .meble td
    {
            background-color: white !important;
            border: 1px solid black;
            font-size: 16px !important;
    }
    
    .meble .td_title
    {
            background-color: lightslategray !important;
            border: 1px solid black;
    }
    
    .td_title, .moce_th 
    {
            background-color: lightslategray !important;
            border: 1px solid black;
    }

1 odpowiedź

odpowiedź 3 sierpnia 2015 przez Comandeer Guru (600,810 p.)
wybrane 7 sierpnia 2015 przez babiak

Najlepsza

Nie są to po prostu wiersze, które wystają poza stronę? Nie ma gdzieś jakiegoś overflow: hidden?

Pokaż 10 poprzednich komentarzy

komentarz 4 sierpnia 2015 przez babiak Obywatel (1,810 p.)

ale w wersji do wydruku w #content mam z kolei: min-height: 100% !important;

komentarz 4 sierpnia 2015 przez Comandeer Guru (600,810 p.)

Ale procentowe wartości dla wysokości działają tylko wówczas, gdy rodzic ma ustaloną wysokość. W Twoim wypadku tak nie jest. Spróbowałbym nadpisac także max-height na wartość auto

komentarz 4 sierpnia 2015 przez babiak Obywatel (1,810 p.)

Bez zmian (w żadnej przeglądarce). A możesz mi wysłać jak Ty to zawsze robisz? Czyli kod odpowiedzialny za content oraz kod odpowiedzialny za drukowanie contentu? Bo już nie mam sił na to, a wiem, że coś źle mam bo żadna przeglądarka nie drukuje ładnie. Tylko nie wiadomo co.

komentarz 4 sierpnia 2015 przez Comandeer Guru (600,810 p.)

Wysłałbym Ci, gdybym miał… Prawdę mówiąc dawno nie pisałem czegoś, co mogłoby być drukowane (no apek się raczej nie drukuje ;)).

Możesz spróbować zerknąć na kod od drukowania w H5BP: https://github.com/h5bp/html5-boilerplate/blob/master/dist/css/main.css#L205 → jest tam nawet fragment poświęcony zwłaszcza tabelkom.

komentarz 7 sierpnia 2015 przez babiak Obywatel (1,810 p.)

Udało się to rozwiązać. Dobrze kombinowałeś z tym max-height: auto. Ja sobie postanowiłem zrobić stronkę na zasadzie takiej, że nagłówek jak i stopka były nieruchome a zawartość strony jak się nie mieściła w tych moich 720 px to pojawiał się scrollbar i można było przewijać go podczas gdy stopka i nagłowek były w tym samym miejscu. To było problemem z wydrukiem. Wyrzuciłem ten max-height : 720 px (zmiana na max-height: auto nic nie zmianiała) i teraz nie ma przewijania diva zawartości scrollbarem, a problem zniknął jak ręką odjął. Wielkie dzięki za pomoc.