1 Replies - 224 Views - Last Post: 10 January 2018 - 05:23 AM

#1 ikhlas06   User is offline

  • D.I.C Regular

Reputation: 1
  • View blog
  • Posts: 327
  • Joined: 20-May 16

how to create outline button in css

Posted 08 January 2018 - 08:10 PM

I am using bootstrap 3. issue is that it doesn't have black outline buttons. Bootstrap 4 does have them but I can not update just yet.

any idea how can I create my own black outline buttons?

my code works good. background black with text white shows up. and if you hover over than background changes to white and text changes to white.

Issue:
when you click on button. for some reason background stays white and text also is white. any idea how can I fix this issue?


Html
<asp:LinkButton  ID="SubscribeLB" runat="server" class="SubscribeLBC btn btn-outline-dark"><span class='glyphicon glyphicon-envelope'></span> SUBSCRIBE</asp:LinkButton>


css code:
.btn-outline-dark {
    background-color: black;
    color: white;
    border:1px solid white;
}
.btn-outline-dark:hover {
    background-color: white;
    color: black !important;
    border: 1px solid black;
}


note this did not worked:
  .btn-outline-dark:hover, .btn-outline-dark:visited, .btn-outline-dark:active {
        background-color: white;
        color: black !important;
        border: 1px solid black;
}


Is This A Good Question/Topic? 0
  • +

Replies To: how to create outline button in css

#2 nensi.panjwani   User is offline

  • New D.I.C Head

Reputation: 2
  • View blog
  • Posts: 8
  • Joined: 10-January 18

Re: how to create outline button in css

Posted 10 January 2018 - 05:23 AM

Hi,

You can use this type of class in bootstrap3 for button outline boreder black.

<button class="btn btn-outline mb1 black">Button</button>


Thanks.
Was This Post Helpful? 1
  • +
  • -

Page 1 of 1