CSS for Inform Notification

PFAFF · October 2015

Is there a way to move the inform popup notification to the top of the page instead of the bottom using just CSS?

peregrine · October 2015

if you mean the inform messages....

yes.

there are lots of tutorials on how to use web developer tools.

some are listed here:

http://vanillaforums.org/discussion/28420/faq-what-frequently-asked-questions/p1

change the number of pixels or percentage as you like.

e.g. put this in your themes custom.css

div.InformMessages {
top: 20px !important;
}

http://www.w3schools.com/cssref/pr_pos_top.asp

PFAFF · October 2015

Thanks!

vrijvlinder · October 2015

    .InformMessages .InformMessage {
    color: #fff;
    text-shadow: 0 1px 1px #000;
    text-align: left;
    border-radius: 5px;
    background: rgba(0, 0, 0, 0.7);
    border: none;
    width: auto;
    max-width: 400px;
    padding: 9px 14px 8px;
    line-height: 1.6;
    border: 2px solid #0fc;
    box-shadow: 1px 1px 12px #0fc;
    }

PFAFF · October 2015

@vrijvlinder those are all the various CSS options, correct?

vrijvlinder · October 2015

@PFAFF said:
vrijvlinder those are all the various CSS options, correct?

not all of them but it shows how far you can take the design and what you can change in it. You can also add a background image , move the position it appears at , convert the links to buttons on and on and on.

PFAFF · October 2015

This is awesome. Thanks so much, man!

CSS for Inform Notification

Comments