When I print a page with a listbox from IE the content owerflows. This only happens in IE and it's only the actual print, the print preview looks good.
Here's a code sample:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head><title></title></head>
<body>
<form name="form1" method="post" action="/IePrintTest.aspx" id="form1">
<select size="4" name="Listbox" id="Listbox">
<option value="item1">item1</option>
<option value="item2">item2</option>
<option value="item3">item3</option>
<option value="item4">item4</option>
<option value="item5">item5</option>
<option value="item6">item6</option>
<option value="item7">item7</option>
<option value="item8">item8</option>
<option value="item9">item9</option>
<option value="item10">item10</option>
<option value="item11">item11</option>
<option value="item12">item12</option>
<option value="item13">item13</option>
<option value="item14">item14</option>
<option value="item15">item15</option>
<option value="item16">item16</option>
<option value="item17">item17</option>
</select>
</form>
</body>
</html>
This renders just fine, but if i try to print this from IE it will look like this:
Image of print
Does anyone know how to fix this. Thanks!
It seems like when printed from IE and size
attribute is applied to select
, the browser sets a fixed height and does not apply the overflow. I don't have the chance to test on IE as I am using Ubuntu, but can you please try to add a style="overflow: hidden;"
to your select
element? If it does not work and removing the size
attribute is an option, try that as well.
How is the use case for this web page? If it's OK to make the user click a button first to open a print page you could serve a printable version of the content in quirks mode by making the serverscript conditionally add the DOCTYPE.
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With