Sayfanın altındaki altbilgi yazdırma üstbilgisinde

yazdırılan sayfa'un altına bir div (altbilgi) öğesi yerleştirmeye çalışıyorum. Firefox'ta bu iyi çalışıyor ve div, yazdırılan sayfanın alt kısmında oturacak. Ancak, Safari penceresinde, tarayıcı penceresi çok uzun değilse, altbilgi basılı sayfa yukarı doğru hareket eder. Örneğin. Tarayıcı penceresi 200px uzunsa, altlık yaklaşık 200 piksel aşağıya yazdırılır. Tarayıcı 400 piksel uzunluğundaysa, sayfadan 400px altbilgi çizer.Sayfanın altındaki altbilgi yazdırma üstbilgisinde

Mümkün olduğunda Firefox'ta alabildiğim gibi aynı davranışı Safari'de almak isterim?

Bunun için kullanıyorum temel kodudur:

<html> 
    <head> 
     <title>Print footer at bottom of a printed page</title> 
     <style type="text/css"> 
      * { margin:0; padding:0; } 
      html, body { height: 100% !important; } 
      #footer { height:25px; border-top:solid 1px #000; 
         position:absolute; bottom:0; } 
     </style> 
    </head> 
    <body> 
     <p>Some content on the page here</p> 
     <div id="footer">This should appear at the very bottom of the printed page</div>  
    </body> 
</html>

Düzenleme: Mutluyum çözüm yazarlardan gerektiriyorsa ... sadece Safari

içinde

kaynak

2010-09-21 Richard

Sadece basılmış çalışması gerekiyor Chrome (Safari ile aynı oluşturma motoru) ve çizgide bunu ... altta ben stil etiketi üzerinde media="print" var

<!DOCTYPE html> 
<html> 
    <head> 
    <title>Testing</title> 
    <style type="text/css" media="print"> 
     html, body { margin: 0; padding: 0; } 
     body { height: 11in; width: 8.5in; } 
     #footer { position: absolute; bottom: 0; } 
    </style> 
    </head> 
    <body> 
    <div id="footer"> 
     This will always print at the bottom 
    </div> 
    </body> 
</html>

Bildirimi gösterdi. Daha fazlası için ALA'da Going to Print'u okuyun.

kaynak

2010-09-21 13:44:11

Teşekkürler. Inç/cm cinsinden bir boyut belirtebildiğini fark etmemiştim. – Richard

CSS'deki mutlak birimler: http://www.w3.org/TR/css3-values/#absolute-lengths –

Kutsal bacalar! Gövde için yükseklik/genişlik değerini {} içine eklemek, Chrome 26'nın basılı sayfayı sığdırmak için web sayfasını aşağı doğru ölçeklendirmesini sağlar. Baskı desteğinin çok iyi olduğunu bilmiyordum. Bu, kullandığım CSS hacklerini radikal bir şekilde basitleştirdi. CSS'nin inç desteğini hatırladığınız için çok teşekkür ederim Bay Stodola. –

Bu sürümü denediniz mi?

http://www.themaninblue.com/experiment/footerStickAlt/

Ben tarayıcılarda çalışır biliyorum ama baskı konusunda emin.

kaynak

2010-09-21 13:47:08 Alex

Kullandığım kod budur. Not Hem Chrome hem de Safari için gerekli olan html ve gövde yüksekliğini% 100 olarak ayarlıyorum.

@media print { 
    html, body { 
    width: 100%; 
    height: 100%; 
    margin: 0; 
    padding: 0; 
    } 
    #footer { 
    position: absolute; 
    bottom: 0; 
    } 
}

kaynak

2012-08-15 05:16:08 tim

Sayfanın altındaki altbilgi yazdırma üstbilgisinde

cevap

İlgili konular