Hi, wondering if anyone has any thoughts / ideas on the following.
i have created a CSS driven Price list for use on the web and as a downloadable PDF - the web and browser support is fine - but if i convert it into a PDF (with Acrobat Professional 7) then half the CSS styles such as font and what not do not display properly and some padding elements are ignored.
It also seems to cut some of the images off at the bottom (of the image)

Just wondering if anyone else has had a similar problem and knows the answer. Its the first time ive tried to make a CSS driven HTML doc into a PDF and its driving me mad. I did one befor in a table based layout and that worked fine.

Maybe there is abetter way to convert these to a PDF?

Thanks in advance.

How are you converting to PDF ??
Do you have a PRINT stylesheet set up ?

sort of - but i havent really done a print style sheet yet im going to have a read up on this today. the style sheet im using is one ive taken from the main site and cut down - just fro that particular price list - maybe i'm doing something wrong. Its probabally got a few errors in it - i've not been doing css for that long now and i'm a bit naff at it anyway!

i have put the code below. Thanks

/* CSS Document */
body {font-family: 'Lucida Sans' Arial, Verdana, sans-serif;}
#wrapper { width: 800px;
margin: 20px;
border: 1px solid #CCCCCC;
}
table { width: 500px;
font-family: 'Lucida Sans' Arial, Verdana, sans-serif;
font-size: 80%;
text-align: center;
}
#content {padding: 10px;}
#header {background-image:url(head.jpg);
height: 150px;}

h1 { text-align:center;
font-family:'Lucida Sans' Arial, Verdana, sans-serif;
font-size: 120%;
border-bottom: 1px dotted #CCCCCC;
padding: 0px 0px 10px 30px;
color: #4f6480;
width: 300px;
}

.boxout {width: 400px;
float: left;
border: 1px solid #999999;
margin: 10px 10px 10px 0;
padding: 10px;
background: #e9ecee;
}

.boxoutright {width: 300px;
float: right;
border: 1px solid #999999;
margin: 10px 10px 10px 0;
padding: 10px;
background: #e9ecee;
}

.bold { font-weight: bold;
text-align: center;
color: #4f6480;
padding-top: 5px;}

p {font-family: 'Lucida Sans' Arial, Verdana, sans-serif;
font-size: 80%;}
/**********TABLE STYLES**********/
table.schedule {
clear: right;
width: 100%;
line-height: 1.4em;
border-collapse: collapse;
border: 1px solid #adbbca;
color: #4f6480;
background: #f0f0f0;
}
table.schedule caption {
margin: 0;
padding: 0;
color: #032469;
line-height: 2em;
text-align: left;
font-weight: bold;
}
table.schedule thead tr {
color: white;
border: 1px solid #adbbca;
background: #5e7796;
}
table.schedule thead tr th {
padding: 0.4em 0.6em 0.4em 0.6em;
border: 1px solid #adbbca;
}
table.schedule tbody tr {
border: 1px solid #adbbca;
}
table.schedule tbody th {
padding: 0.6em;
border: 1px solid #adbbca;
}
table.schedule tbody td {
background: #e9ecee;
padding-left: 0.6em;
border-bottom: 1px solid #ccc;
}
/*changes here******/
table.schedule tbody tr.odd {
background: #c4cfdb;
border: 1px solid red;
}
.sold{color:#CC3300;
font-weight:bold;
text-align: left;
padding-left: 5px;
}
.soldsc{color: #003333;
font-weight:bold;
text-align: left;
padding-left: 10px;
}
.avail { color: #0099CC;
text-align:left;
padding-left: 10px;
font-weight:bold;
}

.left {text-align: left;
padding-left: 5px;
}
.galicon {padding-right: 10px;
}

#footer {
margin-top: 10px;
clear:both;
height:150px;
background: url(images/BG-Footer800wide.jpg) no-repeat;
}

#footer-valid {
float:left;
margin-top: 75px;
padding-left:20px;
color: #4f6480;
}

#footer-valid a {
color:#ffffff;
text-decoration:none;
}

#footer-valid a:hover {
color:#ffffff;
text-decoration:underline;
}

#footer-valid p {padding: -10px;
font-weight:bold;}

If you're using the Print function to convert to PDF, you're going to need the print stylesheet. A good resource for this can be found here: http://css-discuss.incutio.com/?page=PrintStylesheets