Misc. Notes

Last updated on 9 Jul 2024
How to Use Markdown in VSCode – Syntax and Examples, https://www.freecodecamp.org/news/how-to-use-markdown-in-vscode/


Create licenses for your projects right from the terminal!, https://dev.to/nexxeln/create-licenses-for-your-projects-right-from-the-terminal-9e1 . Main point for me: Confirmation that normal routine would be to create license on Github, commit and then pull in the license (change) to local repo (to get local repo in sync with github repo). The article is mainly on a CLI license genarator done by the author but, as of now at least, I am not getting into that stuff.

How do I auto-resize an image to fit a "div" container?, https://sentry.io/answers/how-do-i-auto-resize-an-image-to-fit-a-div-container/

...

Easy fix for: Blocked attempt to show a 'beforeunload' confirmation panel for a frame that never had a user gesture since its load, https://www.uriports.com/blog/easy-fix-for-blocked-attempt-beforeunload-confirmation-panel/

....

To get an inline element (e.g. link to ref. page) to right end of line having field label on left, float:right provides the solution. Example code:
HTML:
          <label for="search">Search string (case insensitive):</label>
          <a
            href="https://developers.google.com/gdata/docs/2.0/reference#Queries"
            target="_blank"
            class="search-format"
            >search format</a
          >
----
CSS:
.search-format {
  float: right;
}

----

To get textarea (and input) fields not to exceed form width I used following CSS (note that I am not using a CSS rule for all elements with box-sizing: border-box; also the margin-bottom property does not impact the form width):
form input,
form textarea {
  box-sizing: border-box;
  margin-bottom: 5px;
}
----

In Chrome, div element does not seem to have any default margin or padding or border. p element seems to have a default margin on top and bottom (1em which is 8px on my setup).

-----

Using float right on element that is followed by a div element resulted in the floated element overflowing into the div element when window width was made small enough. This seems to be expected behaviour of float and there is a clear: right; property-value to prevent this. Ref: https://www.w3schools.com/css/css_float_clear.asp , https://www.w3schools.com/css/tryit.asp?filename=trycss_layout_clear .

I used the above solution and the issue was fixed.

Interestingly when the float right element is followed by a textarea element, it does not overflow into the textarea even if the textarea element does not have a clear: right property-value.

...

How to Publish an HTML Website on Netlify or GitHub Pages, https://www.freecodecamp.org/news/publish-your-website-netlify-github/

What is the difference between properties and attributes in HTML?, https://www.geeksforgeeks.org/what-is-the-difference-between-properties-and-attributes-in-html/

favicon.ico was not being picked up by Chrome. After closing and reopening Chrome, it was getting picked up.

...


...


100vw and the horizontal overflow you probably didn’t know about, https://destroytoday.com/blog/100vw-and-the-horizontal-overflow-you-probably-didnt-know-about

What is the difference between ‘width: 100%’ and ‘width: 100vw’ in CSS ?, https://www.geeksforgeeks.org/what-is-the-difference-between-width-100-and-width-100vw-in-css/

...

This article gives reasons why HTML frames have been made obsolete by w3.org in HTML5: HTML Frames Are Obsolete In HTML5: Here's How To Make Them Responsive, https://html.com/frames/.

...

Debugging console JS programs run with node

"... the JavaScript Debug Terminal will automatically debug any Node.js process you run in it. You can create a Debug Terminal by ---skip-command-palette-stuff---, or by selecting the Create JavaScript Debug Terminal from the terminal switcher dropdown."

I used the above (from terminal switcher dropdown) and it worked well.

...

To get IP address of mobile hotspot:
'ipconfig /all' in Windows PC. The gateway IP is mobile hotspot IP.

...

In Powershell if some standard command does not execute (e.g. dir /s), prefix it with cmd /r (e.g. cmd /r dir /s). Ref: https://stackoverflow.com/questions/1479663/how-do-i-do-dir-s-b-in-powershell


Comments

Archive