You would like to slightly change the display of the Cassiopeia templates in Joomla? This can be achieved with the help of the file 'user.css'. In this article you will find code snippets for uncomplicated use cases.
Configure the up link in Cassiopeia so that it is always visible
Add the following code to the user.css file if your goal is to configure the up-link in Cassiopeia so that it is always visible and not only at the end of the page.
#back-top { position: fixed; }Hyphenation
Normal hyphenation
Hyphenation is activated by CSS with the hyphens property. Hyphenation uses the rules of the language specified in HTML-Language Code[^w3schools.com/tags/ref_language_codes.asp].
body {
hyphens: auto;
}More information: hyphens[developer.mozilla.org/en-US/docs/Web/CSS/hyphens] and word-break[^developer.mozilla.org/en-US/docs/Web/CSS/word-break]
Maybe helpful:
<wbr>Word Break: the word is wrapped without hyphen if there is not enough space. Example:dogs<wbr>leash.­Soft Hyphen: The word is hyphenated if there is not enough space. Example:dogs­leash. Non Breaking Space: If the line break between two words should be prevented, a protected space must be inserted. Example:3 cm.
Force hyphenation
The overflow-wrap property specifies whether the browser can wrap lines with long words if they run beyond the container. Especially in mobile view, such overhanging is not user-friendly. When swiping, the whole view shifts. With the value anywhere a wrap is forced. More information at selfhtml.org[^wiki.selfhtml.org/wiki/CSS/properties/overflow-wrap]
body {
overflow-wrap: anywhere;
}
Webmentions