urls being shown after links when printing web page


Tags: html,css

Problem :

I have an issue with a site that I've created. When the page is printed (as in command+p) it prints out the urls of hyperlinks as part of the page content. I'm guessing this is using the :after pseudo class to add the href attribute after hyperlinks, but I can't find any instance in my stylesheets where it might be doing this.

I'm including the modernizer script in my page so it might be caused by something that script is doing.

It's difficult to debug this problem. Is there a way to spoof @media so that any stylesheets and scripts think I'm using print rather than screen?

UPDATE: I found the css that was causing this, but I could have found it faster if I had the use of firebug, which brings me back to my original question: How can I debug the print stylesheet using firebug. Do you just change the media attribute on the print stylesheet <link/> or is there a way to spoof it with the browser.



Solution :

The Web-Developer plugin allow you to do that.

http://chrispederick.com/work/web-developer/

Install it -> Look at toolbar -> CSS -> Display CSS by Media Type

Also, similar question here : How do you debug printable CSS?


    CSS Howto..

    JavaScript: how do I make a tooltip follow the cursor *and* flip on collision?

    How to center links in header using CSS?

    How to print javascript within HTML id tag

    How to embed video on my first website

    how to set the background color of the whole page in css

    How to copy a CSS style from a website for re-use

    How can I stop a CSS keyframe animation?

    How To Add CSS & JavaScript Into Windows Form Application C#.net

    How to use the not selector correctly in CSS [duplicate]

    How to put a background image on a site

    How to apply dynamic CSS for the label in IE7

    How to center FontAwesome icon in css before content vertically

    How large can CSS values be?

    How to use a different font CSS color for all Internet Explorer browser versions?

    CSS: How to fill a dynamic container that contains fixed sized elements?

    Showing a demo of my CSS on any website

    How to draw realistic smooth slit shadow with Pure CSS3?

    How can I draw such 2 lines in this shape using CSS HTML

    How do I apply css to second level menu items?

    How do I make my django app load content as I scroll?

    how to have a menu across top with links left aligned and right aligned

    How to dynamically set and modify CSS in JavaScript?

    How to make the height REALLY 100%

    Unordered List Navigation Bar: How to I make some buttons go to the right of the navigation page?

    How to create css classes which are “stronger” that elements?

    How to leave input file button usefull for drag and drop from desktop, but avoiding local redirection

    How to set CSS rules for input, except one type

    How do I center “my” navigation bar?

    how to create a css attribute swapper between two elements?

    How to create and apply CSS to javascript Alert