Wrap wrap issues with hugo

support
1

How do I fix Hugo’s wordwrap for regular blog text?
It’s cutting the words in half often, or just 1 letter.

2

I doubt that Hugo cuts or wraps anything. But without you code or at least the URL exhibiting the problem, there’s no way to tell what is happening.

1 Like
3

Thanks for the reply.

Having the CSS files for themes/colors or the web server running do not change the issue.

4

removing the word-break: break-all will help (line 137 in your example)

.single1-4{
    display: flex;
    flex-direction: column;
    max-width: 700px;
    min-width: 200px;
    flex-wrap: wrap;
    border-radius: 20px;
    word-break: break-all;
}

Developer mode in Google Chrome is a big help

1 Like
5

Ah good eye. Please forgive my ignorance, but is there a way to change all the pages at once in hugo via the config? I don’t see word-break or anything like that in the config or theme css as is. Maybe I can add one?

6

The styles are hardcoded in your provided file…if thats hugo generated it must be somewhere.
If its not you, its the theme.

Using the theme as a module will hide the stuff eventually.

Maybe contact the theme author could be a bug or a special feature…
Maybe the theme supports customizing styles…

Manual adjusting depends on the themes and your content. Or a brite force overwriting by own css via css flag important.

Think you’ll have to share your code to dig in

7

Hi, I would prefer not to post it publicly on the forum at this time. Would you potentially help me fix the wrap issue privately for pay?

8

Which theme u are using?

If you did not customize anything I`ll have a look.

If you did, you may add read access to your repo for me

9

It is not helpful to remove the link to the file. You want help, so let others help you. And help readers of the forum to understand what the problem is.

Aside: Including style elements with literal styles (instead of referencing a CSS file) is not a good idea maintenance wise. Neither is using px or pt in CSS dimensions (imagine what that does on smaller or larger devices).

Just run the HTML through a validator (https://validator.w3.org) – it’s full of structuring errors (like li inside a div, where it has no place).

10

And if there are no secrets inside I’m with @chrillek

Looks like the wordpress variant is online anyhow

11

And that’s also full of bad habits (literal style at the wrong places). W3C’s CSS validator reports 170 errors and nearly 1000 warnings.

I suggest not reproducing the faulty WP code in Hugo.

1 Like
12

This topic was automatically closed 2 days after the last reply. New replies are no longer allowed.