How can I “display:none” to some adjacent text with CSS?


Tags: css,css-selectors

Problem :

The code I need to work on looks like this:

    <p>
    <a href="http://foo.com/foo.html"></a>
    <a href="http://creativecommons.org/publicdomain/mark/1.0/" rel="license">
    <img alt="Public Domain Mark" src="http://i.creativecommons.org/p/mark/1.0/88x31.png" style=""></a>
    <br> This work is free of known copyright restrictions... 
    </p>

It displays an image and then some text after the image. I need neither to display.

This works fine to get rid of the image:

a[rel="license"] {display:none;}

However, I need a way to get rid of the text after the <br> (and its unclosed tag if possible) and can't lose the closing </p> tag.

I am grabbing the HTML from a remote site and have no control over the markup there.

Thanks in advance for your help!



Solution :

There's no way to hide this text using CSS, without adding a tag aground it- depending on how you're grabbing the site, your best bet would be to attempt to find "This work is free of known copyright restrictions..." and replace it with the same text surrounded by <span></span>; or simply deleting it altogether.


    CSS Howto..

    How to add nav icon images using max-width property in CSS

    How to edit mobile CSS in SocialEngine?

    How to make navigation follow when scrolled down? [duplicate]

    How can I conditionally assign a color to text in jade

    How to use CSS to horizontally fill the width of page with HTML menu headers?

    How do I let the DOM know about new elements created on the fly?

    how to horizontally center a div of 10000px (wider than full screen) in CSS?

    How can I make Non-English quotation marks with a help of CSS? [closed]

    how to affect an element's width by one child element but not others using CSS

    CSS Selector-How to locate Parent Element

    How does css scale transform affect document flow?

    How to deal with different screen resolutions in CSS?

    How to have equal padding on both side of a div. CSS

    Show a box on top of an image in an HTML page

    How To Remove Awesomium.net Scroll Bars? & Auto Scroll?

    How can I set CSS only for specific IE browsers?

    How would you code this: The SO highlighted button outline effect [closed]

    How can I align the tops of two paragraphs in this example without resorting to an empty header? (e.g.,

     

    )

    How to add Bootstrap to Fullpage.js

    how to only load one IFRAME using @media and display:none; CSS

    How to style picture gallery to allow portait and landscape pics that are also links

    How to add multiple CSS classes to HTML node in Closure template (soy)?

    How to add text with css without pseudo-element

    CSS HTML how to ignore some css for non ie7 or ie8

    How to add css library to project generated with angular-cli@webpack

    How to show Only 4 slides in a row using Bxslider

    Hide all div element but show first two

    CSS visited links- how to recognize visited links which visited by clicking through my app?

    How I add a CSS class to first element of an array in PHP?

    How to use bootstrap-theme.css with bootstrap 3?