{"id":46844,"date":"2019-10-20T03:01:15","date_gmt":"2019-10-19T17:01:15","guid":{"rendered":"http:\/\/www.rjmprogramming.com.au\/ITblog\/?p=46844"},"modified":"2019-10-20T08:09:06","modified_gmt":"2019-10-19T22:09:06","slug":"css-iframe-troubleshoot-primer-tutorial","status":"publish","type":"post","link":"https:\/\/www.rjmprogramming.com.au\/ITblog\/css-iframe-troubleshoot-primer-tutorial\/","title":{"rendered":"CSS Iframe Troubleshoot Primer Tutorial"},"content":{"rendered":"
\"CSS<\/a>

CSS Iframe Troubleshoot Primer Tutorial<\/p><\/div>\n

The modern browsers all have good “web inspectors” Google Chrome’s access to one being via “View -> Developer -> Developer Tools”. So when we decided to finally try and nut out the annoyance up the top left of RJM Programming’s Welcome page where some unnecessary border lines were showing, it was no surprise to involve Chrome’s Developer Tools. After all, how else would you expect me to answer when I asked myself “Are you surprised you picked Google Chrome’s Developer Tools to suss out those lines?”. Of course in the wacky days of school I may have said (to myself) “Do you want a five minute argument, or do you want a ten minute argument?” … or … “3:15, over in the park … if I’m not there, start without me” … but we digress<\/font>.<\/p>\n

It was an odd troubleshooting problem, in that the problem, this time, was not with what was defined<\/i> in the HTML code, but more with what was not defined<\/i>. And this had us searching (lots of fgrep’ing at the command line) for clues that kept ending in dead ends.<\/p>\n

Then realized the block of odd looking CSS that I could not find anywhere, namely …<\/p>\n


\niframe {
\n border-width: 2px;
\n border-style: inset;
\n border-color: initial;
\n border-image: initial;
\n}
\n<\/code><\/p>\n

… was in a window labelled “user agent stylesheet”. What is user agent stylesheet<\/a>? The good first link<\/a>, thanks, got us to understand that this is a web browser Web Inspector’s last resort, and so …<\/p>\n