CSS for RSS pop up preview

I don’t understand why you are writing -fontfamily instead of the actual CSS property which is font-family. Is this a new alternate CSS syntax? The best way to figure out how to style elements is with browser dev tools. With the pop-up on screen, right-click on it and select Inspect. You will then be in your browser dev tools and can make live changes to the CSS and see the results. If you make a mistake in the syntax, it will also show you right in the dev tools. Finally, if you create a new rule and it does not light up, it means your selector is not matching the item you’ve selected.

It’s even possible to select an item and click on the + at the top of the stylesheet section to have the browser create a CSS selector for the item you clicked on.

I took a look at your rule and it will work if you format it like this:

.ll_rss_preview_title h1 {
    font-size: 14px;
    font-family: Sans-Serif;
}

Yannick,

That was strange — I copied it from the Safari properties during inspection so I guess it pasted that way. The original code was correct except for how you changed it to .ll_rss_preview_title h1 instead of h1.ll_rss_preview and that did the trick!

Thank you for your help, still have much to learn ; )

Ray

Ooops. Marking resolved.

Hmm, I just noticed the pop up windows is too big on mobile. I’m guessing CSS can take care of this — any suggestions?

Thanks,
Ray

Well, you can use the following selector to modify the window dimensions:

@media only screen and (max-width: 600px) {
    div#TB_window {
        width: 200px !important;
        margin-left: -90px !important;
    }
}

As you can see, had to use important parameters since these properties are set in the window’s direct style tag.

That being said, the position of the window is calculated for desktop based on the pop-up window size parameters that you specify in the Pop-up tab of library settings. So depending on how variable your content it, it might not be easy to resize the window for mobile and have it perfectly centered.

It does pop up correctly now in mobile however the text within bleeds out to the old boundaries.

It is not really critcal though.

Thanks again,
Ray

If you can provide a page where you have this setup, I can have a look this week-end and see adjustments in browser dev tools.