No More Posting New Topics!

If you have a question or an issue, please start a thread in our Github Discussions Forum.
This forum is closed for new threads/ topics.

Navigation

    Quasar Framework

    • Login
    • Search
    • Categories
    • Recent
    • Tags
    • Popular
    • Users
    • Groups
    • Search

    How to change the color of the text of a placeholder

    Help
    4
    4
    2647
    Loading More Posts
    • Oldest to Newest
    • Newest to Oldest
    • Most Votes
    Reply
    • Reply as topic
    Log in to reply
    This topic has been deleted. Only users with topic management privileges can see it.
    • L
      Laulu last edited by

      Hello, my question is already in the title.

      I try but without success to change the color of my placeholders. 😩

      I show you the html code for clarity. Thank you ☺

      0_1535708169700_Screenshot at août 31 11-32-28.png

      1 Reply Last reply Reply Quote 0
      • C
        cheesy last edited by cheesy

        You can use:
        class_name::placeholder { color: #000000 }
        My personal recomandation use as much path you can instead of the class name just to be sure your css is not overiten by other from the framework or any other third party.

        1 Reply Last reply Reply Quote -1
        • E
          esteban last edited by

          I placed this in my app.styl

          $desired-color = purple
          .q-if
          .q-input-target-placeholder
          color $desired-color !important
          .q-input-target
          &::-webkit-input-placeholder /* Chrome/Opera/Safari */
          color $desired-color !important
          &::-moz-placeholder
          color $desired-color !important
          &:-ms-input-placeholder
          color $desired-color !important

          May it helps

          1 Reply Last reply Reply Quote 0
          • G
            ggarcia last edited by

            .my_class input::placeholder { }
            And for Microsof Edge and Internet Explorer
            .my_class input::-ms-input-placeholder { }

            1 Reply Last reply Reply Quote 0
            • First post
              Last post