Topic: Input fields show a vertical border when box-shadow is overwritten

NitinMistry free asked 4 years ago


Expected behavior: Input fields should appear normal when their box-shadow property is overwritten.

Actual behavior: Input fields display a 1px vertical right border when box-shadow CSS property is overwritten in my CSS.

Resources (screenshots, code snippets etc.):

input.color-black {
    box-shadow: 0 1px 0 0 black!important;
}

Screenshot:

http://delamanospanish.com/register.png


Marta Wierzbicka staff answered 4 years ago


Hi,

we will try to fix this problem in our package but first, please reproduce this problem in the snippet here: https://mdbootstrap.com/snippets/. It will be easier for us to help you when we see your real code.

Best, Marta


NitinMistry free commented 4 years ago

Thanks Marta for your reply. Creating a snippet may not help reproduce the issue as it will be an isolated case. I will be making this page live in a couple of days and will send you the link as soon as it is done. It's probably because of the way I have coded or probably other libraries that I have included which may be interfering.


NitinMistry free commented 4 years ago

Hi Marta,

I have made the pages live. You can check the right border issue on input fields at...

http://delamanospanish.com/portal/html/register.html


Marta Wierzbicka staff commented 4 years ago

Hi,

this code intentionally makes black 1px right border: input.color-black { box-shadow: 0 1px 0 0 black!important; } because the settings are box-shadow: top right bottom left. So if you remove 1px and give 0 there won't be any right border. I'm not sure this is help you need. If you still need some help, please write to me.

Best, Marta


NitinMistry free commented 4 years ago

Thanks Marta. It worked.


FREE CONSULTATION

Hire our experts to build a dedicated project. We'll analyze your business requirements, for free.

Status

Closed

Specification of the issue

  • ForumUser: Free
  • Premium support: No
  • Technology: MDB jQuery
  • MDB Version: 4.8.11
  • Device: Desktop
  • Browser: Chrome v78.0.3904.108
  • OS: Windows 8.0/8.1
  • Provided sample code: No
  • Provided link: Yes
Tags