Forums

The forums ran from 2008-2020 and are now closed and viewable here as an archive.

Home Forums CSS How to create some simple menu buttons?

  • This topic is empty.
Viewing 8 posts - 1 through 8 (of 8 total)
  • Author
    Posts
  • #148274
    knowledgenotebook
    Participant

    Hi,

    I’ve posted a similar note a few days ago on this thing. That is, I have a fully functional web app, and yet my client would like it to look better.
    And now I have a new idea, why not turn Menu Items into Buttons (with some nice CSS code)? Menu Item such as [Add Patient], [Add Visit]…

    Here’s the app URL,
    http://184.73.76.212/mpod
    username:donli
    password:qazplm

    And I wonder if any of you could get me started on this since I really suck with CSS… btw, the CSS-Tricks menu items for forum posting such as [Bold], [Italic] looks awesome.

    Many thanks.

    #148285
    linardzb
    Participant

    Im not sure, but here could be the resource you could try. It lets you customize the button as you please, just play with it. Nice app by the way

    http://www.cssbuttongenerator.com/

    #148322
    Paulie_D
    Member

    Simples:

    .button, .markItUpHeader ul li, #rcp_submit {
    display: inline-block;
    border: 0;
    border-radius: 0;
    outline: 0;
    background: #4e68c7;
    box-shadow: 1px 0px 1px #203891,0px 1px 1px #3852b1,2px 1px 1px #203891,1px 2px 1px #3852b1,3px 2px 1px #203891,2px 3px 1px #3852b1,4px 3px 1px #203891,3px 4px 1px #3852b1,5px 4px 1px #203891,4px 5px 1px #3852b1,6px 5px 1px #203891;
    color: white;
    white-space: nowrap;
    font-family: 'Gotham Rounded A', 'Gotham Rounded B', "proxima-nova-soft", sans-serif;
    padding: 9px 16px;
    line-height: 1.4;
    position: relative;
    top: -5px;
    }
    

    http://codepen.io/Paulie-D/pen/yJExr

    #148358
    Paulie_D
    Member

    I don’t need to log in to ask how are they styled now.

    Just post some code or make a reduced case in Codepen

    #148365
    Paulie_D
    Member

    Just post some code or make a reduced case in Codepen

    #148369
    Paulie_D
    Member

    Why are you including ul li?

    #148381
    Paulie_D
    Member

    So what is the issue?

    http://codepen.io/Paulie-D/pen/FduIC

    #148384
    Paulie_D
    Member

    You aren’t explaining very well.

    I’ve given you the CSS….you really need to build a Codepen and explain PRECISELY what YOUR problem is.

Viewing 8 posts - 1 through 8 (of 8 total)
  • You must be logged in to reply to this topic.