What do you mean exactly? What do you have to change in the css?
All styles are fixed. Not adapted to the mobile screen.What do you mean exactly? What do you have to change in the css?
That's not true!
Thanks - if it's a good job, I'll see when I submit it for validation
You could make the use of CSS here and "ellipsis" I think, I do.Tastenplayer wrote: ↑Fri May 18, 2018 6:26 pm Edit:
One problem is just: If someone has such a long forum title and description as I have in my forum, then it is no longer responsive. It is simply impossible to take everything into account. Then you as a forum operator just have to adapt this yourself in the css.
Code: Select all
/* Manage long names */
.my-awesome-class {
white-space: nowrap;
/* you MUST set a fixed width of choice here, to make all of this working */
width: 160px;
overflow: hidden;
text-overflow: ellipsis;
}
@media screens
to change the fixed width, in case - for every device.Code: Select all
h5 {
font-family: Arial, Sans-serif;
margin-top: 16px;
font-size: 1.2em;
white-space: nowrap;
/* you MUST set a fixed width of choice here, to make all of this working */
width: 220px;
overflow: hidden;
text-overflow: ellipsis;
}
Code: Select all
h5{
font-family: Arial, sans-serif;
font-size: 1.2em;
width: 600px;
text-overflow: ellipsis;
cursor: pointer;
word-break: break-all;
overflow:hidden;
white-space: nowrap;
margin-top: 16px;
}
h5:hover{
overflow: visible;
white-space: normal;
width: auto;
}
Code: Select all
h5:hover{
overflow: visible;
white-space: normal;
width: auto;
background: #222;
}
Code: Select all
@media (max-width: 700px) {
h5 {
width: 310px;
}
}
Code: Select all
@media all and (max-width: 525px) {
.h8 {
font-family: Arial, Sans-serif;
font-size: 1.1em;
text-align: center;
display: block;
margin-top: 1.1em;
font-weight: bold;
color: #aaaaaa;
}
}
Code: Select all
<span class="h8">
EIN TREFFPUNKT FÜR KEYBOARDER, TASTENPLAYER, LIVE-MUSIKER UND GESANGTALENTE
</span>