Super Sale Limited Time 50% OFF for All-Access Plans
Save 50% Now

Bootstrap readonly vs disabled


Bootstrap has the following css style that covers both readonly and disabled inputs


.form-control:disabled, .form-control[readonly] {
background-color: #e9ecef;
opacity: 1;
}


but metronic only implements the disabled CSS and not the readonly one, when it really should.


.form-control:disabled {
color: var(--bs-gray-500);
background-color: var(--bs-gray-200);
border-color: var(--bs-gray-300);
opacity: 1;
}


Text formatting options
Submit
Click any option to insert into your comment. Select text first to wrap it.
  • **text** to make things bold
  • *text* to emphasize
  • ### Heading to make headings
  • [link text](url) for links
  • ![alt text](image-url) to paste in an image
  • - item to make a list
  • 1. item to make an ordered list
  • > quote to quote somebody
  • `code` for single line of code
  • ```js ... ``` for JS code block
  • ```html ... ``` for HTML code block
  • ```scss ... ``` for SCSS code block
  • ```php ... ``` for PHP code block
  • --- for a horizontal rule
  • happy  :)
  • shocked  :|
  • sad  :(

Replies (5)


Many thanks regarding submitting this kind of fantastic write-up! I came across your internet site perfect for my own wants. It includes great and also beneficial content. Maintain the nice perform! Your guide at Assoc-Ins



I've got not long ago started off some sort of blog site, the internet people produce here possesses served everyone enormously. Appreciate it intended for all of your current time period & do the job. วีซ่าออสเตรเลีย



This is usually a superb posting, With thanks to get allowing people this review. Continue to keep writing. dywany dla dzieci



Outstanding submit, travelled in advance and also book marked your internet site. My partner and i can’t hold out to learn a lot more coming from an individual. kasyno skrill



Hi,

May I know which Metronic version are you referring to? The latest Bootstrap does not customize the read-only input state. It only differentiates the disabled input state.
Please check the original read-only input state <a hre="

Regards.


Text formatting options
Submit
Click any option to insert into your comment. Select text first to wrap it.
  • **text** to make things bold
  • *text* to emphasize
  • ### Heading to make headings
  • [link text](url) for links
  • ![alt text](image-url) to paste in an image
  • - item to make a list
  • 1. item to make an ordered list
  • > quote to quote somebody
  • `code` for single line of code
  • ```js ... ``` for JS code block
  • ```html ... ``` for HTML code block
  • ```scss ... ``` for SCSS code block
  • ```php ... ``` for PHP code block
  • --- for a horizontal rule
  • happy  :)
  • shocked  :|
  • sad  :(
Text formatting options
Submit
Click any option to insert into your comment. Select text first to wrap it.
  • **text** to make things bold
  • *text* to emphasize
  • ### Heading to make headings
  • [link text](url) for links
  • ![alt text](image-url) to paste in an image
  • - item to make a list
  • 1. item to make an ordered list
  • > quote to quote somebody
  • `code` for single line of code
  • ```js ... ``` for JS code block
  • ```html ... ``` for HTML code block
  • ```scss ... ``` for SCSS code block
  • ```php ... ``` for PHP code block
  • --- for a horizontal rule
  • happy  :)
  • shocked  :|
  • sad  :(