Archived topic
Blogpost styling
7 replies · Started by _blank on June 9, 2020
Hi
I want to make the background of the title of the blogpost as Black
For ref. pls see this photo - https://ibb.co/HCBy5pJ
I want to make that portion as black in color and the text as white.
So can you pls let me know that how can i achieve that?
Thank You :)
Hi there,
try this CSS:
/* remove space between header and featured image */
.post-image-below-header.post-image-aligned-center .inside-article .featured-image {
margin-top: 0 !important;
}
/* Force entry header to fill space */
.single-post .entry-header {
margin: -40px -40px 0 -40px;
padding: 40px;
background-color: #000;
color: #fff;
}
@media (max-width: 768px) {
.single-post .entry-header {
margin: -30px -30px 0 -30px;
padding: 30px;
}
}
/* Change entry header and meta text color */
.single-post .entry-header, .single-post .entry-header .entry-meta, .single-post .entry-header .entry-meta a {
color: #fff;
}
Yehhh!
Thank You so much!
Now it looks cool.
You're welcome
Hi!
I trust you are doing well and staying safe!
I just need a little help!
the css you gave me above has the background as black!
Can i change it to a Gradient background?
i want blue gradient color like this this - https://uigradients.com/#AzurLane
In the above CSS. Replace:
background-color: #000;
for this:
background: #7f7fd5; /* fallback for old browsers */
background: -webkit-linear-gradient(to right, #7f7fd5, #86a8e7, #91eae4); /* Chrome 10-25, Safari 5.1-6 */
background: linear-gradient(to right, #7f7fd5, #86a8e7, #91eae4); /* W3C, IE 10+/ Edge, Firefox 16+, Chrome 26+, Opera 12+, Safari 7+ */
Thank you so much 😍🙏
Glad to be of help