Why does Upfront display correctly on certain browsers?

I am attempting to use UpFront to design my personal site, but I am having issues. In Google Chrome, when I am logged in or not, the site displays in the screenshot. In Safari, the "my awesome stub content goes here" doesn't show up. What is going on?

Also, I am confused as to how to use the "element css styles" setting? For example, I used the "element css styles" to change the color of the font in my navigation menu to gold. Based on the element it's ".upfront-plain_txt ", but when I select the "my awesome stub content goes here" it uses the same element. Why does that happen?

Hope I am making sense.

  • Anang

    Hi Julius

    I am attempting to use UpFront to design my personal site, but I am having issues. In Google Chrome, when I am logged in or not, the site displays in the screenshot. In Safari, the "my awesome stub content goes here" doesn't show up. What is going on?

    That's weird, I've checked on my browser but it doesn't show your "my awesome stub content... " text, all of its. Made sure you clear your browser cache, before checking the site. You may see some different result from different browser, but if an element's is missing, maybe it's cache issue :slight_smile:

    Also, I am confused as to how to use the "element css styles" setting? For example, I used the "element css styles" to change the color of the font in my navigation menu to gold. Based on the element it's ".upfront-plain_txt ", but when I select the "my awesome stub content goes here" it uses the same element. Why does that happen?

    Element css styles, will use same selector for same component, for example paragraph. It will always use '.upfront-plain_txt p' selector. But you can have different style even tough they have same selector, just made sure that you save the css with different name on your widget settings. Upfront will "wrap" your selector with some an unique selector (widget id), to made sure that css definition only applied in specific widget , not all over upfront elements :slight_smile:

    Let me know if you have further questions :slight_smile:

    Best Regards

  • Tyler Postle

    Hey Julius,

    Do you mind granting support access so we can have a closer look on your install?

    You can grant support access via WPMU DEV > Support > Support Access > Grant Access.

    That should help us replicate the issue :slight_smile:

    Did you try clearing your cache in Safari? Or opening up a private browser in Safari and using that? It could be a cache issue as Anang mentioned. Generally, the editor won't be cached, which is why it might show up there but not on the frontend.

    One additional question: I would like my picture to be aligned completely to the left of the screen. How do I do that?

    Elements must still be contained within the main content container, are you wanting it outside of that as far to the left as it can go? In that case, you may want to create a background image of it and add it as the background of that region. Then it can extend past the container.

    Look forward to hearing back!

    All the best,
    Tyler

Thank NAME, for their help.

Let NAME know exactly why they deserved these points.

Gift a custom amount of points.