# Cosmetic bug? pinned posts links

**URL:** <https://discuss.write.as/t/cosmetic-bug-pinned-posts-links/8630>\
**Category:** Bugs\
**Created:** [April 2, 2023, 1:52am UTC](https://discuss.write.as/t/cosmetic-bug-pinned-posts-links/8630 "2023-04-02T01:52:23Z")\
**Posts on this page:** 5\
**Page:** 1

<div class="post-metadata">

**Author:** ![writeprivacy](https://discuss.write.as/letter_avatar_proxy/v4/letter/w/e0b2c6/32.png) [@writeprivacy](https://discuss.write.as/u/writeprivacy)\
**Post date:** [April 2, 2023, 1:52am UTC](https://discuss.write.as/t/cosmetic-bug-pinned-posts-links/8630/1 "2023-04-02T01:52:23Z")

</div>

When the line of pinned posts comes to an end, a pinned post title gets line broken if there is a space in the title. If there is no space in the title, then the previous title with a space gets line broken.

Example:

pin1 pin2word1 SPACE pin2word2 pin3word1 SPACE pin3word2 pin4word1 SPACE LINEBREAK  
pin4word2 pin5word1 SPACE pin5word2  
In this way a title gets split between one word on line 1 and one word on line 2. It confuses me, and I think readers would be confused as well.

To me it would make more sense to linebreak not in the title of a pinned post, but between titles of different pinned posts, like:

pin1 pin2word1 SPACE pin2word2 pin3word1 SPACE pin3word2 pin4word1 SPACE pin4word2 LINEBREAK  
pin5word1 SPACE pin5word2

Maybe a cosmetic bug to be fixed?

The only solution I found so far to not linebreak in the middle of a post title is to replace the space with a character or symbol and add a space at the end of each pinned post title. I ended up using ˜ instead of a space between post title words, just to avoid the linebreaking in inopportune places.

pinword1 ˜ pinword2 SPACE

Not visually appealing I find.

---

<div class="post-metadata">

**Author:** ![writeprivacy](https://discuss.write.as/letter_avatar_proxy/v4/letter/w/e0b2c6/32.png) [@writeprivacy](https://discuss.write.as/u/writeprivacy)\
**Post date:** [April 3, 2023, 1:05am UTC](https://discuss.write.as/t/cosmetic-bug-pinned-posts-links/8630/2 "2023-04-03T01:05:03Z")

</div>

A workaround, which does not work under every circumstance I found, is to use either of:  
markdown: &#160 (nobreak space character)  
html:   
said to be legacy: &nbsp (nobreak space character)  
Old blog post titles (from 2 years ago) seem to not take this into account. New blog post titles do.

---

<div class="post-metadata">

**Author:** ![matt](https://discuss.write.as/user_avatar/discuss.write.as/matt/32/2760_2.png) [@matt](https://discuss.write.as/u/matt)\
**Post date:** [April 7, 2023, 11:40pm UTC](https://discuss.write.as/t/cosmetic-bug-pinned-posts-links/8630/3 "2023-04-07T23:40:41Z")

</div>

You can do this a little easier with some custom CSS – it’ll make sure individual links don’t break between words. Just add this to your blog to apply it to all posts.

```css
a.pinned {
    white-space: nowrap;
}

```

As far as making it the default for everyone, I’m not sure if that’s what they’ll want. But everyone should feel free to weigh in one way or the other!

---

<div class="post-metadata">

**Author:** ![writeprivacy](https://discuss.write.as/letter_avatar_proxy/v4/letter/w/e0b2c6/32.png) [@writeprivacy](https://discuss.write.as/u/writeprivacy)\
**Post date:** [April 13, 2023, 12:01pm UTC](https://discuss.write.as/t/cosmetic-bug-pinned-posts-links/8630/4 "2023-04-13T12:01:56Z")

</div>

Thanks Matt.

Found another post about this kind of issue.

> [@Pinned menu puts entry on two lines](https://discuss.write.as/t/pinned-menu-puts-entry-on-two-lines/1772/4):
>
> Hi @PaulSutton, the CSS property you’ll want to use here is white-space: nowrap – this tells the individual links not to wrap the text inside them. All together, with that .pinned section cleaned up, this CSS should work: .pinned { color: #0000ff; background-color: #ffffff; font-weight: 900; white-space: nowrap; /\* Prevent links from wrapping \*/ } body#collection header nav { overflow-wrap: break-word; /\* Allow overall nav to wrap links \*/ }

The solution however doesn’t seem to work on my screen, it keeps everything on one line with horizontal scrolling.  
The css part of write.as tells the code is over qualified (No clue what that means)

Any code I could add to force a linebreak after a specific pinned post?

I tried various combinations, all unsuccessful to me.  
Tried `&#13; &#10; &NewLine;`

The only thing that’s giving me a half elegant solution is to have:  
SPACEword1&#160word2SPACE for each pinned post title, and javascript the pinned post URL to another page.

---

<div class="post-metadata">

**Author:** ![davepolaschek](https://discuss.write.as/letter_avatar_proxy/v4/letter/d/51bf81/32.png) [@davepolaschek](https://discuss.write.as/u/davepolaschek)\
**Post date:** [March 20, 2025, 8:44pm UTC](https://discuss.write.as/t/cosmetic-bug-pinned-posts-links/8630/5 "2025-03-20T20:44:50Z")

</div>

I know this isn’t what you were looking for, but on the [LMJargon File](https://lmjargon.info), I wanted an index down the left edge of all pages. I used pinned entries with some custom CSS.

```auto
@media screen and (min-width: 830px) {
    a.pinned + .pinned {
        margin:0 !important;
    }
    header nav a {
        margin:0 !important;
    }
    a.pinned {
        display: block;
        align-content: center;
    }
    nav:has(.pinned)
    {
        position: absolute;
        top: 3em;
        left: 3em;
        width: 70px;
        border-right: groove;
    }
}

```

That gives me a single column of all the pinned pages down the left edge of the page. Specificall, the style for `a.pinned` contains `display:block;` which breaks after each pinned item. You could use that same idea for a “break-after” class of anchor, perhaps? You could keep the pinned pages across the top I suspect, too.
