JavaScript tips

 Chrome behaved strangely when I put a 'div' inside an anchor ('a') tag. Chrome put the 'div' after the anchor tag rather than inside it. I fixed this by changing the 'div' tags to 'span' tags and set the 'span' tags to 'display: inline-block'. However, it seems the HTML5 specification says that you can put an anchor tag around most tags. There are discussions about this on 'stackoverflow.com'. My 'div' contains other 'divs'. The anchor tag is inside some complex HTML - a simpler example worked fine. I am using an old version of Chrome: the last version on Windows7 from the start of 2024.  (My local library has not upgraded from Windows7 yet. The library has instead installed a more recent version of Firefox. Sadly some websites like 'Outlook' and 'Pinterest' do not completely work with the old version of Chrome) The 'divs' are for an RSS icon made in CSS from:     'codepen.io/da...

 I had to change a '#' to '%23' in an SVG in a 'data' URL of a 'background-image' property in CSS. I had to do this when changing RGB colors to hexadecimal when 'minimising' my page using a bit of Perl:     s/rgb\(\s*(\d+),\s*(\d+),\s*(\d+)\)/sprintf("%s23%02x%02x%02x","%",$1,$2,$3)/eg; (My old version of Perl does not allow '%%' in the 'sprintf' in the substitution) All the other 'special' characters are encoded in the SVG in the 'data' URL.  The 'background-image' property looks like:     url("data:image/svg+xml;charset=utf8,%3Csvg%20viewBox%3D%220%200%20168%... There are online tools to do the encoding. A PNG image would need full 'base64' encoding to go in a 'url' but an SVG does not. There are more tips at:  bbingo.xyz/techtips/