mellowtigger: (penguin coder)

For easier searching later, I decided to make a brief post today just about some HTML tags that I use.

For pre-formatted text, I discovered in yesterday's post that long lines of powershell code were not wrapping to new lines. I eventually got it working as intended by formatting the HTML tags like this:

<pre style="white-space: pre-wrap;">Text goes here. blah blah blah.</pre>

I wonder, though, if I should switch to monospace font for computer code? In the past, there was the TT (teletype) tag, but apparently that's another technology that has been deprecated. Here's an example of the new KBD (keyboard) code instead. I don't know. It looks exactly the same to me, except for the change in vertical spacing. I'll stick with PRE instead, I guess. I could use KBD inline within a paragraph if needed.
<kbd>this is a test. blah blah blah.</kbd>

Far more frequently, however, I use the HTML tag to display a little sideways-arrow which users need to click to "open up" a section of text. Using this tag liberally helps keep long posts from flooding other peoples' blog feeds. Readers can choose whether or not to read the long diatribes (or see the large pictures) in the main part of the blog post. Here is the code I use to accomplish that feat:

<details>
<summary>Click the arrow to read the blah blah blah...</summary>
All of the usual blog content goes here.
</details>

There. Now I can find these tag details again when I click the HTML tag on my blog. Bread crumbs to help a failing memory.

mellowtigger: (penguin coder)

When I use lists, I like having extra vertical space between each listed item. I have done it for years here by deliberately adding two line breaks at the end of each line as:

<br/><br/>

I'd prefer something easier, so I can do it once and not have to repeat it for every item in the list. I tried the following code, and it works great in a test editor, but it fails in an actual Dreamwidth page.

<p>
<style type="text/css">
  li { margin-bottom: 1em; }
</style>
<ol>
<li>A</li>
<li>B</li>
<li>C</li>
</ol>
</p>

I'd rather have an inline code that I put into the OL element, but I couldn't even get that much to display properly in the test editor. I thought I knew my basics, but this simple problem has me stumped. (Please don't make me learn Dreamwidth Journal Themes. I'm going to have to learn Dreamwidth Journal Themes, aren't I?) Any suggestions?

Profile

mellowtigger: (Default)
mellowtigger

About

December 2025

S M T W T F S
  123456
7 8910 111213
14151617181920
21222324252627
28293031   

Most Popular Tags

Syndicate

RSS Atom
Powered by Dreamwidth Studios
Page generated 2025-Dec-12, Friday 11:38 pm