XF 1.5 Need to create text container/wrapper/body

#1
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
 
Last edited:

Optic

Well-known member
#2
Hi @Luke_Daniel_Rodgers, easiest way would probably be to mimic the styling of a notice.

Try this:
HTML:
<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>
 
#3
Hi @Luke_Daniel_Rodgers, easiest way would probably be to mimic the styling of a notice.

Try this:
HTML:
<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

Well-known member
#4
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.
 
#5
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

Well-known member
#6
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:

Code:
<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..
 
#8
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:

Code:
<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.
 
Top