Archived topic
css for increasing in size and changing color of a php generated button
14 replies · Started by robmac on August 1, 2017
Hi,
Apologies, I tried to find this in previous answers to forum questions...but nothing really nailed it!
I've generated, by php, a post, the post contains a "More Details" button, that takes people to an external link.
I've tried different CSS to increase the button size and change both the actual button color and the text on it, but no luck.
I'm not sure if the CSS I'm using is right, I used a plugin called "Site Origin/CSS" to generate the code, I then enter that code in to Simple CSS - I ONLY save the code to Simple CSS. I only use Site Origin to guide me in generating the actual code - works great, saves a mountain of time for a non-coder like me, except with this. Below is a starting point Site Origin generates:
a img {
color: #d16014;
font-size: 20px;
line-height: 25px;
font-weight: bold;
}
The figures, in the above example [I've added] are just a stab in the dark to get started - but is "a img" a legitimate starting point for button CSS?
Any help appreciated. Thank you.
Hi there,
Any chance you can provide a link to your site so we can see the button?
Thanks!
Hmm that's an image file so you can't really increase the size without losing quality and certain can't change the color using CSS: http://www.decorandflooring.com/media/images/details.gif
It would be the best to just edit the image file itself and reupload it.
Or you can make your own button using CSS: https://docs.generatepress.com/article/adding-buttons/
OK...thank you Leo for taking a look and your expert advice, much appreciated.
You're very welcome :)
Hi Tom/Leo,
Follow-up to the above please.
re http://www.decorandflooring.com/test-blog-post/
Try as I might...I'm not having any luck turning the ENTIRE [including header and footer region sections] post linked above, into the bright yellow/gold color I've currently got SOME of it displaying as....if I can get the CSS rules right, I can then play around with the final color choices. So far, I've tried the CSS rules lsted below.
Could you offer any suggestions please, on CSS rules I'm missing? I'd also like to include the SAME color for visited and hover-over functions - so the ENTIRE post appears as just a solid one color please. Any advice appreciated please. Thank you.
header-content {
background-color: #EFBC46;
}
body {
background: #EFBC46;
}
content {
background: #EFBC46;
}
header {
background: #EFBC46;
}
footer {
background: #EFBC46;
}
inner-content {
background: #EFBC46;
}
td {
background: #EFBC46;
}
You are wanting that color/style only on that page I assume? or all posts?
only that ONE page please.
CSS classes need to start with a dot.
Try something like this
.site-header, .separate-containers .inside-article, td, .site, .site-content, body {
background-color: #EFBC46 !important;
}Make sure you use Tom's Simple CSS plugin and insert the add in the page CSS metabox.
Thank you Leo....much appreciated.
No problem!
Thanks Leo - it 98% worked....if I could please ask one more thing, I've already tried a few alternates to fix it myself - but down each side of the page in question, there's a strip that's not changed to the desired color...any suggestions please? Thank you.
Edited the code here so it includes body: https://generatepress.com/forums/topic/css-for-increasing-in-size-and-changing-color-of-a-php-generated-button/#post-359708
Thank you Leo...you must have the "magic touch", because I did it all by the book, looked at the source code, saw "body" entered it [and obviously I didn't do it right], because it didn't work....your way worked straight off the bat!
Thanks again!
You're very welcome :)
