Newsfeed Wrap with CSS

[Mykle1]

@schlittrix

From stackoverflow. I have not tested it.

This should center the wrapped text as well. In custom.css file, add :

text-align: center;

[schlittrix]

@mykle1
Thank you. I tried this css-setup. The lengh is fine, but the center-function doesn’t work.

newsfeed-desc { width: 700px; }
text-align: center;

[sdetweil]

@schlittrix the text align has to be inside the bracesof the newsfeed class

[schlittrix]

@sdetweil ouh. I’m a beginner :D
so this way?

newsfeed-desc { width: 700px; text-align: center; }

[sdetweil]

@schlittrix yes

u can specify lots of style elements in a single class like that

for readability you should put the contents on separate lines inside the braces
like this

newsfeed-desc { 
     width: 700px; 
     text-align: center; 
}

[schlittrix]

@sdetweil said in Newsfeed Wrap with CSS:

@schlittrix yes

u can specify lots of style elements in a single class like that

for readability you should put the contents on separate lines inside the braces
like this

newsfeed-desc { 
     width: 700px; 
     text-align: center; 
}

thank you so much :)
I will try this today in the evening

[schlittrix]

@sdetweil said in Newsfeed Wrap with CSS:

@schlittrix yes

u can specify lots of style elements in a single class like that

for readability you should put the contents on separate lines inside the braces
like this

newsfeed-desc { 
     width: 700px; 
     text-align: center; 
}

so i tried this step without success…
When I just have the “width”-line, the text is wrapped, but not centered.
But when I put in these code with text-align, nothing happend and the text is no more wrapped…

any ideas? :(

[sdetweil]

@schlittrix

try this

newsfeed-desc { 
    width: 700px;
    display: flex;
    justify-content: center;
}

from here https://stackoverflow.com/questions/6618648/can-overflow-text-be-centered

[schlittrix]

@sdetweil said in Newsfeed Wrap with CSS:

newsfeed-desc {
width: 700px;
display: flex;
justify-content: center;
}

Don’t know, maybe I’m stupid…
but it still doesn’t work…
this is my config-setup:

 {
                        module: "newsfeed",
                        position: "bottom_bar",
                        config: {
                                feeds: [
                                        {
                                                title: "Tagesschau",
                                                url: "https://www.tagesschau.de/xml/rss2/"
                                        }
                                ],
                                showSourceTitle: true,
                                showPublishDate: true,
                                broadcastNewsFeeds: true,
                                broadcastNewsUpdates: true,
                                showDescription: true,
                                wrapDescription: true
                        }
                },

and this is the css-file:

newsfeed-desc {
    width: 500px;
    display: flex;
    justify-content: center;
}

[sdetweil]

@schlittrix i don’t KNOW exactly how to make it work… I;m guessing as I haven’t played with this at all… SO… its quite possible it wouldn’t work…

i’ll try to get to this a little later today

so this works

.newsfeed-desc {
    width: 500px;
    position: absolute;
    left: 37%;
    text-align: center;
}

use this algorithm to calc the left edge
(((yy-xx)/2)/yy)*100
where xx is the width of your news area
and yy is the width of your screen

also, notice the leading dot (.) on the class name, this is required

one other thing… the align: center, aligns EVER line centered… so the 1st line won’t fill to the width …