![segoe ui font with shadow segoe ui font with shadow](https://bachgiamedia.com.vn/font-segoe-ui-tieng-viet/imager_4_17591_700.jpg)
So, watch it on the space that’s between the letters and the outside of the box here. So, I’m just going to cut that, hit Save just so you can see what the difference is. Currently it’s set to 10 pixels all the way around. Now, the padding refers to the padding within the box here. So, that’s how you style the width of the Trigger Box, is that value right there at the bottom.
![segoe ui font with shadow segoe ui font with shadow](https://image.slidesharecdn.com/designfordevelopersonlineversionlong-111125071710-phpapp01/95/slide-56-1024.jpg)
It comes out to about here, and now it’s much wider.
![segoe ui font with shadow segoe ui font with shadow](https://user-images.githubusercontent.com/2319473/137637525-d63fe004-9da5-4ff8-81c2-eede89d31c2b.png)
If we change that into width equals 500, watch the size of the Trigger Box now. So, the first thing that we see at the bottom here is it says width equals 300.
#Segoe ui font with shadow how to
So, let me just break down this CSS for you and so maybe you don’t want it grey, you don’t want the text, I’m going to show you how to change all that stuff really quick. It’s big and when someone types “hello,” it is a different font and a different color. Now, I’m going to refresh the page and now look at our box. I’m simply going to paste in that CSS code here and hit Save. Now, I am using Catalyst so I have a box here for Custom CSS but any WordPress theme has a CSS file. So, what I need you to do is copy this, select it on Copy and then go to your theme CSS file. But for those who need a little bit of extra help, underneath this video is this CSS code. For those CSS ninjas out there, just use the CSS class WP Triggers and style your boxes. But sometimes you need to make it a little more fancy. It’s a simple text box and when someone types in the trigger, let’s say hello that’s what the text looks like. webkit-box-shadow: inset 0 0 10px #000000 įont-family: “wf_SegoeUILight”,”wf_SegoeUI”,”Segoe UI Light”,”Segoe WP Light”,”Segoe UI”,”Segoe”,”Segoe WP”,”Tahoma”,”Verdana”,”Arial”,”sans-serif” īy default, WP Triggers Trigger Boxes look like this. Copy and paste the CSS code below into your theme CSS file: