2010-06-01 3 views
0

У меня есть список расширений телефона, которые я хочу напечатать на его дружественной версии.версия для печати плавающего списка

У меня есть print css для печати на бумаге, расширения расположены в неупорядоченном списке, которые перемещаются влево.

<ul> 
    <li>Larry Hughes <span class="ext">8291</span></li> 
    <li>Chuck Davis <span class="ext">3141</span></li> 
    <li>Kevin Skillis <span class="ext">5115</span></li> 
</ul> 

плаваю его влево, и когда он печатает вторую страницу, она кончает название часть списка (в Firefox, отлично работает в Google Chrome и IE), смотрите здесь: http://cl.ly/de965aea63f66c13ba32

Я имею в виду: http://www.alistapart.com/articles/goingtoprint/ - они упомянули что-то о применении float: none; на часть содержимого страницы. Если я это сделаю, как мне следует сделать список, отображаемый в 4 столбцах? Это динамический список, извлеченный из базы данных.

Любая помощь приветствуется.

ответ

0

Если целью списка является объединение имен с расширениями, то более подходящим является dl или table. Если цель списка просто перечислить имена и расширения просто ... дополнительная, я предполагаю ты хорошо с ul - а для этого ul, это CSS, кажется, работает хорошо здесь:

/**/@media print { 
ul { 
    list-style: none; 
    margin: 0; 
    padding: 0; 
    font: 12px/18px sans-serif; 
} 
li { 
    float: left; 
    width: 24%; 
    margin: 0 1% 0 0; 
    position: relative; 
    border-bottom: 1px solid gray; 
} 
li 
span { 
    position: absolute; 
    right: 0; 
    top: 0; 
} 
/**/}
+0

этот css будет работать для правильной печати? он появляется на веб-странице так, как я этого хочу, просто не правильно, когда я печатаю его на бумаге. – Brad

+0

@Brad: Не верьте мне на слово, попробуйте и посмотрите – reisio

Смежные вопросы