- This topic has 8 replies, 2 voices, and was last updated 1 year, 7 months ago by Fernando.
-
AuthorPosts
-
August 29, 2022 at 10:00 pm #2327891xinghui
Hello, I created a button on the page, now I want to change the width of this button to 100%, my approach is to add code inside the css, but I don’t know why the code I added doesn’t work, please help me Check out how to fix this problem. At first my idea was to directly add html code to create a new button, but now I want to create it directly with your button and change the width of this button to full width
August 29, 2022 at 10:14 pm #2327898Fernando Customer SupportTo have a better understanding of the issue, may you provide the link to the site in question and point us to where we can see the button?
You may use the private information field for this: https://docs.generatepress.com/article/using-the-premium-support-forum/#private-information
August 29, 2022 at 11:05 pm #2327918xinghuihi,here is my image url :https://postimg.cc/rKvNPn7Z,You can directly open this URL to view the picture directly ,Please reply in time and provide me with effective help, thank you
image insert:August 29, 2022 at 11:08 pm #2327922xinghuiAugust 29, 2022 at 11:09 pm #2327923Fernando Customer SupportYou shouldn’t add CSS in the additional CSS class section. CSS should be added in Appearance > Customize > Additional CSS.
Moreover, if you’re using a GB Button Block, you can select the Buttons Block, and set it to fill horizontal width as such: https://share.getcloudapp.com/o0uXp8Ep
August 29, 2022 at 11:22 pm #2327931xinghuiFernando, thank you very much for your reply, my problem has been solved, I used the Button Block->fill horizontal width you said, which is very convenient, but I have a question, please explain it to me, I like your theme very much Editor, want to know more about its usage, such as what is this additional CSS class section used for? What is the difference between it and Appearance > Customize > Additional CSS, and if I want to add css to the button by myself, how should I write the code in Appearance > Customize > Additional CSS? Looking forward to your reply, thank you very much
August 29, 2022 at 11:32 pm #2327941Fernando Customer SupportSo, in HTML, elements can have classes.
For instance, if you look at the HTML of your website, you’ll see that your button has a class
gb-button
for instance.See for example: https://share.getcloudapp.com/OAujzqjO
Classes can be used to target elements for custom code.
Say you want all buttons with class
gb-button
to have a black colored text, you can go to Additional CSS and add.gb-button { color: #000; }
Now, if you add a class in the additional CSS class list in the block settings, you can use that class as your target for custom code.
So for instance, you only want specific Containers to have a
background-color
of green, then, you can addmake-green
to the class list of those containers and add this code:.make-green { background-color:#00ff00; }
August 30, 2022 at 12:35 am #2327990xinghuiFernando, thank you very much for your screenshots and patient explanation, I have understood the relationship between the two and know how to use their functions correctly, thank you very much, best wishes
August 30, 2022 at 12:44 am #2327998Fernando Customer SupportYou’re welcome Xinghui!
-
AuthorPosts
- You must be logged in to reply to this topic.