▼
Streaming live at 10am (PST)

Styling buttons

Design help General
#1

Hello there!

I am a little stuck with something. I am trying to create circular buttons with arrows that will allow the user to navigate to the next page (not a slider but a button). And I want the button to have a slight gradient in colour once the button is hovered over and cliked on… the below image is what I am trying to create. One left arrow button and one right arrow button.

12.JPG1360×353 53.7 KB

I have created this: from using a button, changing the text into a symbol and making the square box into a circle. How can I center the arrow? And is the best way to approach this?

Many thanks :slight_smile:

#2

Can you please share your read only link with us? Thanks! :sunglasses:

#3

I’m creating it using link blocks and Div’s… I might be ok :slight_smile: I will keep you posted!!

#4

https://preview.webflow.com/preview/vrxstudiostest?preview=d6b7c05caf2767179319e234344171fa

#5

Can you please point me to the page the elements are on and their class names? Thanks! :sunglasses:

1 Like
#6

Thank you :slight_smile:

I figured out how to design these! It took a bit of time but they look good :slight_smile:

Can you have a look a something else for me if you can? I think there is a glitch on my site but I am not sure. Are you able to look at three pages from the link below?

https://preview.webflow.com/preview/vrxstudiostest?preview=d6b7c05caf2767179319e234344171fa

Page 1.JPG812×776 62.6 KB

page2.JPG818×760 94.8 KB

page3.JPG837×760 117 KB

The tabs 1, 2 & 3 should show the same text on each of the pages. But the tabs are not working properly and only 2 & 3 are the same. What could be the issue here?

#7

Also if you would like me to share this on another page I don’t mind. I’m never sure who to ask if I run into issues and you always seem very helpful!! :slight_smile:

#8

I figured it out, in the picture below, on the element that is selected, remove the padding of 109 and all should be good from there. :sunglasses:

Be sure to ask anymore questions if you have any. :wink:

Screen Shot 2016-06-28 at 07.17.45.png3232×1328 2.25 MB

1 Like
#9

As always, thank you VERY much!!!

#10

I am nearly finished the design of my website. Very exciting! I have yet to start making things work, like the tab bar and all of the buttons. Would you recommend any tutorials for this?

#11

This topic was automatically closed 60 days after the last reply. New replies are no longer allowed.