Focal Point
[SOLVED] Button Shape

This topic can be found at:

September 18, 2018, 10:01 AM
[SOLVED] Button Shape
I have a requirement that my buttons should be in Oval or Round shape instead of square or rectangle, Please let me know how to change the shape of a button in 8.2.03


This message has been edited. Last edited by: FP Mod Chuck,

WebFocus-8/Windows/HTML, PDF, EXCEL
September 18, 2018, 11:02 AM
Mike Williams
Unfortunately I'm on 8105m. Not certain if the HTML canvas is still relatively the same in 8.2.03.

If you click on the button in the HTML canvas (I'm assuming you're using the stock button from the components tab) go to the properties and scroll until you find the Border section. Click to expand and scroll again down to the border-radius. Enter a value in pixels, so maybe 5px or 10px. That will give you the rounded edges you might be seeking.

WF Version 8105
September 18, 2018, 02:35 PM
Same way for 8.2

WF versions : Prod 8.2.04M gen 33, Dev 8.2.04M gen 33, OS : Windows, DB : MSSQL, Outputs : HTML, Excel, PDF
In Focus since 2007
September 18, 2018, 02:52 PM
You can use IMAGES instead of BUTTONS and add Tasks and Animations to them in your HTML page.
September 18, 2018, 05:20 PM
You should be able to do this in CSS.

How TO - Round Buttons


Prod:WebFOCUS 7.6.10/8.1.04Upgrade:WebFOCUS 8.2.07OS:LinuxOutputs:HTML, PDF, Excel, PPT
In Focus since 1984
Pity the lost knowledge of an old programmer!

September 19, 2018, 08:53 AM
You can set it at the button Properties.
Border-radius : 50% will give you oval shape.
You can set the height to 35% and border-radius to 50% to get a circle.

webFOCUS 8206
Windows 10
September 19, 2018, 10:54 AM
In the properties when in HTML go to the border section. There are four options for the radius of the corners.

WebFocus 8.002
PMF 8.2.3
Windows, all output