Hide Message Border
-
Is there a way to hide the blue border displayed to the left of the Message?
I tried adding the following CSS but it didn’t work:
.login .message, .login .notice, .login .success
Specificity: (0,2,0)
{
border-left: 0px;
}
-
Hello @rene-michaels
Branda has a feature that allows you to apply custom CSS code for internal pages of the WP Admin Dashboard:
https://wpmudev.com/docs/wpmu-dev-plugins/branda/#custom-css
Such feature should help you to hide messages like this, as long as there is a way to select them using CSS (sometimes it can be tricky because WordPress core didn’t added a specific class or id for these messages).We may not be able to assist you with the specific CSS code, but I can see that the “border-left” property may not work, please try with the “border-left-width” property instead:
https://www.w3schools.com/cssref/pr_border-left_width.phpKind regards,
Jair.I was hoping you could provide the correct CSS to do this since there is no color option in the plugin settings. It appears the class is:
.login .message, .login .notice, .login .success {
border-left: 4px solid #3858e9;
padding: 8px 12px;
margin-top: 0;
margin-left: 0;
margin-bottom: 20px;
background-color: #fff;
word-wrap: break-word;
}I have tried:
.login .message, .login .notice, .login .success {
border-left: none;
}But that didn’t work. Any other suggestions?
Hello @rene-michaels ,
I hope you are doing well.
It seems your login selector is wrong. Instead of using a class, please try with ID.
E.g., #login .message, #login .notice, #login .success
Kind Regards,
Fida Al HasanStill no luck. The “message” element itself has no ID.
Here is a copy of the element:
<div class=”message”><p>Test</p></div>Here is a copy of the styles:
color: #3c434a;
font-family: -apple-system,BlinkMacSystemFont,”Segoe UI”,Roboto,Oxygen-Sans,Ubuntu,Cantarell,”Helvetica Neue”,sans-serif;
font-size: 13px;
line-height: 1.4;
–wp-admin-theme-color: #3858e9;
–wp-admin-theme-color–rgb: 56,88,233;
–wp-admin-theme-color-darker-10: #2145e6;
–wp-admin-theme-color-darker-10–rgb: 33.0384615385,68.7307692308,230.4615384615;
–wp-admin-theme-color-darker-20: #183ad6;
–wp-admin-theme-color-darker-20–rgb: 23.6923076923,58.1538461538,214.3076923077;
–wp-admin-border-width-focus: 2px;
margin: 0;
border-left: 4px solid #3858e9;
padding: 8px 12px;
margin-top: 0;
margin-left: 0;
margin-bottom: 20px;
background-color: #fff;
word-wrap: break-word;Hello @rene-michaels ,
Thank you for the update.
In your previous CSS code, you were using the following selectors.
.login .message, .login .notice, .login .successHere, .login means you are targeting the login class. However, WordPress Login/Registrator forms use the login CSS ID. So, you will need to use #login to select the login CSS ID.
Please check this screenshot: https://prnt.sc/iJALkSSbmjJU
Kind Regards,
Fida Al HasanI understand, but that still didn’t work.
No worries, I figured it out with Claude’s help. For others out there trying to do this the correct CSS is:
body.login #login .message,
body.login #login .notice,
body.login #login .success {
border-left: none !important;
}NOTE: This in Branda’s Custom CSS section under the Login page settings specifically, not in your WordPress Additional CSS, since this is a login page style and needs to be scoped there.
Hello @rene-michaels,
Glad to know that you were able to resolve the issue. Thank you for sharing an update.
Please feel free to let us know if you need further help. However, please note, sharing a full working custom code solution is outside of the scope of support we can provide, but we will try to point you in the correct direction.
Kind Regards,
Saurabh
You must be logged in to reply to this topic.