HTML - Help Making Page Print Properly!
Can someone please tell me why this page does NOT print properly?
http://www.unreal-deals.com/ebooks11...-printable.php I've tried everything I can possibly think of, removed all word html tags, cleaned up the source formatting, and still it doesn't work. Print preview on IE7 shows only 7 pages, and when I print it only prints 1 page then 60+ blank pages. Whats going on? Thanks Similar TutorialsI need to know what the common practice is to open a printable page in a new window after a link is clicked. Something that you can print from the page or from the browser. Normally I would just open in a blank target but the window doesn't open up tight to the printable media. Any help would be great. Thanks! Hi Guys. My website contains a lot of text, and its continually printed by clients as it includes pricing etc. At the moment my pricing page is 4 pages of paper, however I wish to be a touch kinder to mother nature and be a bit more eco-friendly so I have created a document with all the pricing on one page which I have saved as a PDF file. I would like to add a link on my website to "Printer Friendly Version" which would link to the PDF and would bring up a print dialog box. What coding would I need to do this? I think it may very well be Java but I'm not the brightest when it comes to this Any help appreciated! I hope this all made sense! Hi, how can I print the page ? <a>Print the page</a> should I use javascript ? which is the correct command (cross-platform) ? thanks Hi there, I am currently designing a website for an art gallery. I thought I had finished it today while viewing it in firefox on my mac, but when I went to view it on internet explorer on a PC the page is not rendered properly! i don't know what to do! I have 2 divs - centercol & rightcol - centercol displays the main content, and rightcol displays an image specific to the content on the page. on my mac it shows like this: on a PC in internet explorer it shows like this: website is at http://pennystewartdesigns.com/merrepen/html/main.html NB: Main page functions fine, but when you click on any other tabs the rightcol displays below the main content in IE. My code is he Code: <!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>Merrepen Arts | About Us</title> <link rel="stylesheet" href="http://pennystewartdesigns.com/merrepen/html/style.css" type="text/css" media="screen" /> <link rel="stylesheet" type="text/css" href="http://pennystewartdesigns.com/merrepen/html/coin-slider-styles.css" media="screen" /> <link rel="stylesheet" type="text/css" href="http://pennystewartdesigns.com/merrepen/html/menusm.css" media="screen" /> <link rel="stylesheet" type="text/css" href="http://pennystewartdesigns.com/merrepen/html/pagenavi-css.css" media="screen" /> <script type="text/javascript" src="http://pennystewartdesigns.com/merrepen/html/js/cufon-yui.js"></script> <script type="text/javascript" src="http://pennystewartdesigns.com/merrepen/html/js/cufon-yankaff.js"></script> <script type="text/javascript" src="http://pennystewartdesigns.com/merrepen/html/js/jquery-1.4.2.min.js"></script> <!-- menu --> <script type="text/javascript" src="http://pennystewartdesigns.com/merrepen/html/js/menusm.js"></script> <!-- scripts for use --> <script type="text/javascript" src="http://pennystewartdesigns.com/merrepen/html/js/script.js"></script> <!-- slider --> <script type="text/javascript" src="http://pennystewartdesigns.com/merrepen/html/js/coin-slider.min.js"></script> <!-- tabs-categories --> <script type="text/javascript" src="http://pennystewartdesigns.com/merrepen/html/js/tabs-hoverintent.js"></script> <script type="text/javascript" src="http://pennystewartdesigns.com/merrepen/html/js/tabs-superfish.js"></script> <script type="text/javascript" src="http://pennystewartdesigns.com/merrepen/html/js/tabs.js"></script> <link rel="stylesheet" href="http://pennystewartdesigns.com/merrepen/html/tabs.css" type="text/css" media="screen" /> </head> <body> <div id="page"> <div id="header"> <div class="logo"> <p align="center"><img src="http://pennystewartdesigns.com/merrepen/html/images/logo1.png" align="middle" alt="Merrepen Arts"/> </p></div> <div class="topnav"> <ul class="menusm"> <li><a href="http://pennystewartdesigns.com/merrepen/html/main.html">Home</a></li> <li><a href="http://pennystewartdesigns.com/merrepen/gallery">Gallery</a></li> <li class="current_page_item"><a href="http://pennystewartdesigns.com/merrepen/html/about.html">About Us</a></li> <li><a href="http://pennystewartdesigns.com/merrepen/html/dalyriver.html">Daly River</a></li> <li><a href="www.merrepenfestival.com.au" target="_blank">Festival</a></li> <li><a href="http://pennystewartdesigns.com/merrepen/html/contact.html">Contact</a></li> <li><a href="http://pennystewartdesigns.com/merrepen/html/visit.html">Visit Us</a></li> </ul> <div class="clr"></div> </div> <!--/topnav --> <div class="clr"></div> </div> <!--/header --> <div class="clr"></div> </div> <div id="centercol" style="background-image: url('http://pennystewartdesigns.com/merrepen/html/images/bg/bgabout.gif'); background-repeat:no-repeat; background-position:top right"> <div class="box post"> <div class="content"> <div class="post-title"> </div> <!--/post-title --> <div class="blog-content"> <div class="post-excerpt"> <p align="center"> <h3>About Merrepen Arts</h3><br /><br /> </p> content.<br /><br /> </div> </div> <!--/post-excerpt --> <div class="clr"></div> <!--/content --> </div> <!--/box --> </div> </div> <!--/centercol --> <div id="rightcol"> <div class="wtitle"> <h3></h3><br /> </div> <div class="content"> <div id="credit"> <img src="images/about.jpg" alt="Merrepen Arts" /> <!--/content --> </div> <!--/box --> </div> <!--/content --> <!--/box --> </div> <!--/rightcol --> <div class="clr"></div> <!--/columns --> <div class="clr"></div> <!--/page --> <div class="clr"></div> <div id="page_bottom"> <div id="footer"> <div class="textf"> <div class="text1">© Copyright <a href="http://www.pennystewartdesigns.com">Merrepen Arts</a>. All Rights Reserved. </div> <div class="text2"><a href="http://www.pennystewartdesigns.com">Design</a></div> </div> </div> <div class="clr"></div> <!--/footer --> </div> </body> </html> my CSS for these divs are he Code: /*=== Layout ===*/ #page { margin:0 auto; padding:0; width:1200px;} /*=== Center Column ===*/ #centercol { margin-left:20px; padding:0 0 38px; float:left; width:800px;} /*=== Right Column ===*/ #rightcol { margin:0; padding:0 0 0 40px; float:right; width:400px; border-left:1px solid #dfdfdf; } .box { margin:0; padding:20px 0;} .box .content { } .box_r { margin:0 0 24px; padding:0; background:none; border:none;} .box_r .content { margin:0; padding:0;} .small_link { padding:10px 0; margin:0 auto; text-align:center;} .small_link a { color:#939393; text-decoration:none;} .small_link small { font-size:11px;} can anyone help? this is the first time i've had this problem & ive been looking at this code for far too long now. it all looks like gobbledy gook to me now!! arrggghhhhhh. so frustrating! penny I need a fool-proof method of making a page break for printing purposes. Nice clean break. I tried using the CSS method, but its doenst work in all browswerrs and is very finicky. Any suggestions? Hello Gurus, I have a HTML webpage index.html and the expecation is that when user selects from drop drown opton it needs to display a webpage in the iframe underneath the option list. Below is the code snippet. From the code, you will see that it displays all www sites such as google.com, yahoo.com just fine without issues, however the local opel.html is not coming up at all. I am pasting the code of index.html as well as the page that i want to call i.e. opel.html. Pleaes help <!----------------------INDEX.HTML CODE STARTS HERE------------------> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="content-type" content="text/html; charset=utf-8" /> <title>Your Murrieta</title> <meta name="keywords" content="" /> <meta name="description" content="" /> <link href="default.css" rel="stylesheet" type="text/css" media="screen" /> </head> <body> <div id="header"> <div> <table> <h1><a href="#" Style="font-family:Edwardian Script ITC" color="White">Your Murrieta</a></h1> </table></div> <p>Showcase of Your World</p> </div> <!-- start page --> <div id="page"> <div id="pagebg"> <div id="content"> <div class="post"> <form action="" method="post"> <SELECT ONCHANGE="if (window.frames && window.frames.iframes) { window.frames.iframes.location.href = this.options[this.selectedIndex].value; }"> <OPTION VALUE="opel.html">My Home Page <OPTION VALUE="http://www.google.com">My Fmaily <OPTION VALUE="http://www.yahoo.com">My Hobbies <OPTION VALUE="http://www.rediff.com">My Friends </SELECT> <iframe id="theFrame" name="iframes" src="opel.html" align="top" height="1460" width="1760"></iframe> </form> </div> <!-- start content --> <!--aaa--> </div> </div> <!--content--> <!-- end content --> <!-- start sidebar --> <div style="clear: both;"> </div> <!-- end page --> <!-- start footer <!-- end footer --> </body> </html> <!--------------------OPEL.HTML CODE STARTS HERE-------------> <html xmlns="http://www.w3.org/1999/xhtml"> <!-- start page --> <body> <table style="margin-left:0%"> <tr> <td> <!--First Panel --> <div style="font-size:9pt;font-family:Georgia; color:Navy; width:345px; background-image:url(images/gray-gradient.gif); background-repeat:repeat;">ERP</div> <div> <table cellspacing="0" cellpadding="15" width="345px" height="79px" bgcolor="#ffffff" align="left" style="background-image:url(images/cnsl.jpg); background-repeat:repeat;margin-right:1%;"> <tr align ="left" width="400px" > <td align ="left"> <ul class="link" type="none" style="font-size:8pt;font-family:Arial;"> <li class="link"> <a style="font-size:8pt;font-family:Arial;" class="link" href="http://www.coexsys.com/erpoffering.html" id="l16">Offerings</a> </li> <li class="link"> <a style="font-size:8pt;font-family:Arial;" class="link" href="http://www.coexsys.com/id145.html" id="l18">Request More Information</a> </li> </ul> </ul> </td> <td align ="left"> <ul class="link" type="none" style="font-size:8pt;font-family:Arial;"> <li class="link"> <a style="font-size:8pt;font-family:Arial;" class="link" href="mailto:sales@coexsys.com" id="l17">Email us</a> </li> <li class="link"> <a style="font-size:8pt;font-family:Arial;" class="link" href="http://www.coexsys.com/id144.html" id="l18">Contact us</a> </li> </ul> </td> </tr> </table> </div> </td> </body> </html> I created a template with photoshop and saved into 1024 x 768 and worked it with front page. when i opened it in firefox the site is apearing at the left side of the window even if i edited in front page to be shown in the middle.In explorer it works just fine. ANy ideas please? Hello all. I am creating my page from home on my personal desktop computer. It has a 17 inch, HP v72 crt monitor. The problem that I am having is getting my page to look right on other computers. eg.,image/text/link placement. Example: My page looks fine when I view it from home on my own pc. But when I view it on my pc at work, everything is out of place. How can I create a website that will look good on all the various monitor sizes, and screen resolutions? Thanks! Hello all, I am looking to see if there is a simple way to provide a print button for static Text and/or images within a simple table. The content will not change, so I want to see if I can provide a programmed print button for the content within each table. The application is a FAQ page of a website. Currently, the page is long and printing a particular FAQ item is not possible. Expecting the viewers to be web-savvy enough to know how to print selected text is out of the question, as well as providing them this tip in writing. There needs to be a print button. I found this: http://download.oracle.com/javase/tu...rinttable.html but since I am not familiar with coding much beyond basic html I am not sure if this applies or how to implement the code examples in a webpage. I use Dreamweaver MX '04 to edit page html. Any help would be greatly appreciated. Thank you in advance. I've been trying to get a design to work properly under Firefox for several days. Unfortunately because of ip issues I can't post any code. The basic problem is that I tell a table that I it to have height: 100% and it won't do it. Sometimes (not always) the table renders in such a way such that it is less than 100%. <table><tr><td><table class="gimme_some_height_already">...blah blah</table> Here's the annoying part. The problem is intermittent and goes away every time when I hit refresh under Firefox. Why should the page render differently just because I hit refresh? Also, when the table doesn't render properly, the links don't work. I have standard, nothing special <a> links inside the table. When the table is misrendered and I click on a link, instead of transferring to that page, the table just gets bigger! It's as if the table were in a very delicate state, and if someone touched or sneezed on it the whole page would move and rerender. Very strange. None of this happens under IE. I know that many people think that when IE and Firefox disagree that I ought to go with what Firefox says, but really hitting the refresh buttons shouldn't make the page look different. Does anyone know what is going on, and perhaps how I could go about fixing it? I've tried many variations, trial and error combinations and dirty tricks. I've spent almost a week designing, coding and uploading this site. Only to have it not display properly in firefox or safari. I've included a link to the site and several screenshots as well as the source code. Please help! This image shows it as it is int ie 7 on windows xp http://img.photobucket.com/albums/v6...asintended.jpg this image shows it on safari and fire fox: http://img.photobucket.com/albums/v6...art/safari.jpg website link: www.tavasystems.com Thanks in advance. Hello all I was wondering is there a way in HTML/JSP to modify the original Print Page Setup, originally defined by the user? What I mean is that no matter what settings the user has on his Page Setup, I always want the page margins to be the following, when a user opens up my HTML and tries to print the page: Right = .75in, Left = .75in, Top = .4in, Bottom = .4in What I am using is the following CSS in my HTML: <STYLE TYPE="text/css" MEDIA="print"> <!-- BODY { margin-left: .75in margin-right: .75in margin-top: .4in margin-bottom: .4in } --> </STYLE> But it doesnt seem to work. If the orginal page margins defined by the user are more than what I am setting through my CSS, it doesnt seem to work. i.e. If the user has all his margins setup to .75in, my CSS doesnt seem to alter the same. I would be glad if someone could help. Thanks Hi Guys, Strange problem. I have a simple webform where users can fill in text and check/uncheck some checkboxes. When this is printed to pdf or paper (or print preview) in IE (7 or 8) the checkboxes are printed unchanged. E.g. user sets a check, this is printed unchecked ... or with a pre-checked box with the user unchecked, is printed checked. Same goes for the radio. Only when I remove the DocType completely, IE prints it correctly. But I need to use XHTML-strict. This is a simple example which fails in IE: Code: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" lang="nl" xml:lang="nl-NL"> <body> <input type='checkbox' name='y'/><br/> <input type='radio' name='x'/><br/> </body> </html> Doesn't work with any doctype I tested (loose or html4). Anyone a idea how to solve this? Many thanks, Michael I want to make a page on my website where someone can enter there email address and it will auto add it to my mailing list. And another place on the website where they can enter there email so unsubscribe to it. I do not have anything to start me of with this. E.g Database. Thanks your help How can I set up a page that automaticaly redirects my visitors to a new page? My webpage: http://beamsvillepharmacy.com/site/index.html Fits my browser perfectly, however when viewed on other computers with a lower resoultion, the page doesn't fit and is too large. How can I edit my code, or go about making it automatically fit with different resolutions? (Right now it's all simple width="" height="", and that's how I was fitting it) Thanks. I have a to make web page containing 2 columns. This is done. Now what I would like to insert in the code is something like this: The 2 columns should be full screen on any resolutions. Something like the page would adapt to the monitor resolution. The percent would be 80% for the first column 20% for the se cond one. What I don't know - is how to do that. Would a table resolve this problem? What would be the code for this? Suggestion are well appreciated. Hi. This is something I have pondered on for a very long time and wish to know how to resolve. I have no idea if it is possible but I think I have seen it done before. I need a piece of code for a frame that will automatically readjust itself to the page that is targeted in the frame, but will only go so far as the parameters I set it to. To me, it sounds like a rather complicated code and I'm really not sure whether it is possible, but if it is, it would be extremely useful for forum pages that are set to be inside a webpage. What I want to achieve with this, is to have the frame to be able to extend itself inside the page, without putting a scrollbar on the actual frame. The page I have isn't actually structured with frames, so I would like to keep it that way. I have no idea if this IS possible but I would like to know. Thanks, KGB. Hi, I am working on adding non java-script buttons on my website using CSS style sheets. I used a technique given at http://builder.com.com/5100-6371-5323375-2.html. I modified the colors a little but it is basically using technique 2 at this link. Everything works well with the exception of one issue. In Internet Explorer, when I press a link and then use the back button on the browser to return to the previous page, the link for the previous page is still selected and the button appears to still be "pressed". You can see this by going to http://www.apexmoves.com with internet explorer, clicking one of the buttons on the left side of the site, and then using the browser's back button. You will see that the link that was clicked is still selected and this button appears to be stuck in the down position. If you click anywhere else on the screen, the button is released. This is because the link for the pressed button is has the status of active. Does anyone have any ideas on how to solve this. Is that a way to make the status of this link "visited"? Any Ideas would be greatly appreciated. Thanks Brad Hi i was wondering if anyone can help me with making my page compatible with older browsers IE7+. My page is www.marksbodyshop.org The css is: Code: html,body { height:100%; margin:0; background-color:#000; background-image:url(../images/firstpage.gif), url(../images/firstpage-backup-for-safari.gif); /* required by Safari */ background-size:100% 100%; } #container { height:73%; background-image:url(../images/update.png); background-size:100% 100%; } #nav { position:absolute; padding:0; margin:0; list-style-type:none; height:7%; width:57%; top:20%; left:20%; z-index:1; } #nav li { width:16%; margin:1%; height:100%; } #nav a { display:block; width:100%; height:100%; outline:none; text-indent:-9999px; background-size:100% 300%; } #about {background-image:url(../images/aboutus.png);} #about1 {background-image:url(../images/contactus.png);} #about2 {background-image:url(../images/freelunch.png);} #about3 {background-image:url(../images/map.png);} #about4 {background-image:url(../images/meettheteambutton.png);} #nav a:hover {background-position:0 -100%;} #nav a:active {background-position:0 -200%;} |