PDA

View Full Version : Buttons


Mvoulgaris
07-22-2016, 04:47 AM
I am trying to make square flat buttons, but dreamweaver makes all buttons look rounded and I cannot adjust the radius. I have tried the following three methods with no adjustments to css or anything, and they are inputed into dreamweaver rounded by default. Any help or advice or insight to this would be huge!

<input type="button" value="hello" />
<button>Hello</button>
<a href'"~" data-role="button>Hello</a>

edbr
07-22-2016, 07:28 AM
yes it is the standard, and may look different dependng on browser.
However you can use css to create the button using a class.
frinstance
a basic buton with no frills
<head>
<style>
.button {
background-color:blue; border:1px solid black; font-size:1.05em;
font-weight:bold; padding:2px 6px; color:#fff;
}
</style>
</head>
<body>
<input type="submit" class="button" value="Download" />

obviously you can decide what you want this way, gradient image background etc

Mvoulgaris
07-22-2016, 08:32 AM
I literally copy pasted your idea to try it, and dreamweaver CS6 (most current version) still shows it as rounded edged buttons

edbr
07-22-2016, 12:43 PM
in a browser?

Mvoulgaris
07-22-2016, 02:29 PM
In live view. And when the use the qr code to view on my android device

edbr
07-22-2016, 05:24 PM
show your code. i find it odd because im sure its correct. i cant test it till tomorrow though.

Mvoulgaris
07-22-2016, 09:19 PM
<a class="button" href="#ActivitiesPage" data-role="button" width="100%">Activities</a>

<link href="style-one.css" rel="stylesheet" type="text/css">

.button{
background-color:blue; border:1px solid black; font-size:1.05em;
font-weight:bold; padding:2px 6px; color:#fff;
}

I attached a print screen of the button and CSS code below to show

Mvoulgaris
07-23-2016, 01:23 AM
I figured it out, Jquery mobile has an issue where they change the default settings of buttons to being rounded, so you have to put in
$('a').buttonMarkup({ corners: false }); to make it square

edbr
07-23-2016, 02:30 AM
AH thought it may be an overide was going to suggest trying !important