XF 1.5 Need to create text container/wrapper/body

[Luke_Daniel_Rodgers]

Hi!

I'm wondering if there is a code for creating a "text-background" or a physical text "wrapper".
For instance, here is my website:

As you can see, the text and image do not have a background, or wrapper box of their own; it is simply showing the websites background. This can cause issues with reading text upon certain colours, as my background changes every day. What you are seeing is the contents of a page

Anyone got any code for this at all? Or perhaps even an addon?

Thank you kindly!
Luke R

 

[Optic]

Hi @Luke_Daniel_Rodgers, easiest way would probably be to mimic the styling of a notice.

Try this:

<div class="PanelScroller Notices" style="display: block;">
<div class="scrollContainer">
<div class="PanelContainer">
    <ol class="Panels" style="position: static;">
        <li class="panel Notice">
            <div class="baseHtml noticeContent">
                Your text here
            </div>
        </li>
    </ol>
</div>
</div>
</div>

 

[Luke_Daniel_Rodgers]

Hi @Luke_Daniel_Rodgers, easiest way would probably be to mimic the styling of a notice.

Try this:

<div class="PanelScroller Notices" style="display: block;">
<div class="scrollContainer">
<div class="PanelContainer">
    <ol class="Panels" style="position: static;">
        <li class="panel Notice">
            <div class="baseHtml noticeContent">
                Your text here
            </div>
        </li>
    </ol>
</div>
</div>
</div>

Would this be directly in a CSS file, or can it be added to the pages description? Though, I'll likely try both and see what happens.
Thank you kindly!

 

[Optic]

It is HTML so you can put it wherever you have the content of that page.

Just replace the "Your Content Here" with your text.

 

[Luke_Daniel_Rodgers]

It is HTML so you can put it wherever you have the content of that page.

Just replace the "Your Content Here" with your text.

Alas, it did not work. - I put it in the descriptive section of the page, however it displayed nought but the text itself. No background drop, no border nor block behind the text.

 

[Optic]

Ah, I just realised the CSS for Notices isn't available unless there is an actual notice being displayed..

Then it would be easier just to do a custom CSS inline for that one page only:

<div style="background-color: #000; color: #FFF; padding: 10px; border: 1px solid #ff0000;">
Your text here
</div>

Of course you can tweak accordingly to match your style..

 

[Optic]

If you want the fonts to be the same style as posts, you can apply the messageText ugc baseHtml class to the div:
https://xenforo.com/community/resources/how-to-create-a-page-node.354/

 

[Luke_Daniel_Rodgers]

Ah, I just realised the CSS for Notices isn't available unless there is an actual notice being displayed..

Then it would be easier just to do a custom CSS inline for that one page only:

<div style="background-color: #000; color: #FFF; padding: 10px; border: 1px solid #ff0000;">
Your text here
</div>

Of course you can tweak accordingly to match your style..

Agh! Works a treat! Thank you kindly chap.