Image with text component has styling issues on pages
I added this big style section on many Chicago pages in Full HTML. (Some pages I have more in the same full HTML block, but this is usually by far the biggest one).
```
<style>
/* Image with column adjustments for responsive breakpoints */
@media (min-width: 768px) {
.paragraph--type-image-with-text.text-alignment-right .group-text {
padding-left: 0;
}
}
@media (min-width: 1120px) {
.paragraph--type-image-with-text.text-alignment-right .group-text {
padding-left: 4rem;
}
}
.field--name-field-cta {
width: auto;
}
@media (min-width: 768px) {
.paragraph .group-content>.field--name-field-title, .paragraph .group-link>.field--name-field-title, .paragraph .group-text>.field--name-field-title, .paragraph>.field--name-field-title {
margin-top: 1em;
}
}
@media (min-width: 1120px) {
.paragraph .group-content>.field--name-field-title, .paragraph .group-link>.field--name-field-title, .paragraph .group-text>.field--name-field-title, .paragraph>.field--name-field-title {
font-size: 1.5rem;
}
}
.paragraph .group-content>.field--name-field-title, .paragraph .group-link>.field--name-field-title, .paragraph .group-text>.field--name-field-title, .paragraph>.field--name-field-title {
margin-top: 1em;
}
</style>
```
https://events.drupal.org/chicago2026/keynote-speakers is a good example because that only has this one single blob of full HTML, so it can be easily isolated :D
If you remove that HTML block, you notice these differences:
1. The left aligned and right aligned image with text components have different text sizes for their title :O
{width=701 height=600}
2. On smaller breakpoint, the left aligned text version has title too close to the image AND it has a CTA that is indented unlike the text.
{width=524 height=600}
3. The other (right aligned) text with image is even more broken with indented text despite showing below the image and even more indented CTA. The title is also too close.
{width=524 height=600}
I believe these things are solved by the above snippet on top of the site theme. I copied the snippet around to a few pages :D
issue