Jump to content

pstein

Members
  • Content Count

    92
  • Joined

  • Last visited

Community Reputation

1 Neutral

About pstein

  • Rank
    Newbie

Recent Profile Visitors

3,974 profile views
  1. Assume I load a web page (from a web server where I have no access) and inspect CSS script files. Some of the CSS rules contain values declared as "!important". I want to overwrite a few of these values (after web page loading by my own user.js script) by other, customized values. Since my values should have priority I am search for a way to declare them "!moreimportant". How can I achieve this? Peter
  2. Assume I have web page which uses a CSS script with lots of rules. Some of them have properties like .foobar { display: grid; grid-template-columns: 1fr 300px; grid-column-gap: 70px; } I want to get rid of all these grid-related instructions in all CSS rules. How can I disable all grid layout stuff completely for all CSS rules of the current webpage? I have no access to the original web server (and the original CSS) but want to overwrite the CSS script in my browser after loading. Peter
  3. Normally a more specific CSS rule has priority over the more general rule e.g. <header class="foobar"> //width=1200px <div> <P> ....</P> //width=860px; </div> </header> But is there a way to let a parent element force to recursively overwrite all nested child CSS rules? In the sample above the header width instruction should overwrite the inner P width instruction. In general all nested width instructions should be overwritten. If a nested element has no width instruc
  4. Lets take an example: https://www.makeuseof.com/tag/how-to-add-cool-effects-videos-android/ When I print this webpage (into a pdf file) then alla rticle pictures are printed in a big, fat dimension. Have a look at the three picture below the section title "1. Glitch Video Effects". They are placed in full format on a full pdf page. I want to get them shrinked down to 20% resp. a maximum width of 200px. Therefore I want to add a new CSS rule. But neither .article-gallery { max-width: 840px !important; } nor img { width:
  5. Lets have a look at an example webpage: https://www.makeuseof.com/tag/lock-methods-android-phone/ Now right click (in Firefox) on the text (starting "You can secure your Android phone's lock screen....") below the headline and select "Inspect element" from context menu The element has a class "heading_excerpt". Now have a look on the element(s) in HTML code just ABOVE this element. They have a class e.g. "heading_meta". Although they are physically written in HTML code ABOVE the "heading_excerpt" they are appear on the loaded webpage in the opposite order. Why?
  6. How can I most easily delete all values of all <name>.....</name> elements of a certain *.xml file? the <name> element tags should be kept. A command line tool and command would be preferred rather than a GUI based tool. The <name> elements contain only value and no further nested elements.
  7. It happens sometimes that I wrote and apply buggy CSS & Javascript/jQuery scripts into a webpage. An errorneous CSS rule could be .myclassname { width: 1024kk !important; }}; or a javascript var pane = document.getElementsByClassName("page-header-meta")[0]; does not find at least 1 instance of the class. So the remaining statements of such a scripts are not executed. How can I find out (in Firefox) which statement is causing the trouble? The webdeveloper pane at the bottom is not really useful. I have problems finding in it errors or warnings wh
  8. Assume I have an element like <img src="https://www.foobar.com/mysmallpic.png" ......>samplepic</img> Now I want to avoid a linking to a picture source on an external server. Instead I want to embed the few KB of the picture directly into HTML source code. I can imagine that there is a method similar to <img src=x'21315112A56CED......58889EFED' ......>samplepic</img> or alternatively with variable: mypic=x'21315112A56CED......58889EFED' ; <img src=mypic .....>samplepic</img> x'...' means the hexadecimal binary content (ANSI or
  9. Obviously this doesn't work since I have NO Access to the original CSS files. I am not the owner of the webserver. I want to change the loaded webpage AFTER loading by scripts with Firefox AddOns like Greasemonkey or Firemonkey. This work fine for many CSS statements. So again: Is there a way to delete @media print { .... } statements AFTER loading?
  10. Assume the following code: <div class="foobar"> "whitespace" <p>....</p> </div> "whitespace" is not the text but a whitespace as indicated in Firefox WebDeveloper. How can I get rid of every whitespace inside after a <div class=foobar"> and the first <p> with Javascript?
  11. Oftentimes web pages include a separate *.css file and have additional special CSS instructions inside for printing the article. How can I delete with CSS-important! or JavaScript this @media print { ............. } rule / instruction? Peter
  12. Lets start with an example from a CSS for a Webpage: <div class="lg:w-10/12 ....">....</div> One of the referenced CSS rules is as follows (mind the additional masking backslash \): .lg\:w-10\/12 { width: 50%; } Now I want to override this CSS statement (later after loading) by the following additional CSS statement: .lg\:w-10/12, .lg\:w-10\/12 { width: 90% !important; } I put the classname WITH and WITHOUT backslash before it. Nevertheless the !important new CSS is NOT accepted. The width is (as shown in WebDeveloper of Firefox) still 50%. What w
  13. Occasionally I load a web page which contains a text line and immediately appended after the right side an image <img> I want to let the <img> start in a next line. So I need a kind of <br> separation between text and image (not with <P>). However I have no access to the original webserver but want to apply a modification afterwards (after loading) I can imagine that there is a CSS property (for <img>) which let me tell the browser engine "put in next line". How can I achieve this in detail? Peter
  14. Assume I have a CSS background key similar to .logo { background: url(/static/foobar/mylogo.jpg) 0px -no-repeat; } Is there a way to convert this background property into a foreground image by Javascript? All other configurations (margin, padding, background-position-x, background-position-,....) should remain untouched or converted accordingly.
×
×
  • Create New...