Not correct alignment of text for blog layouts in Cassiopeia template

[radik10]

Steps to reproduce the issue

create e.g. 3 pcs. of 200x200 px as intro images (Or use for intro image https://dummyimage.com/200x200/848484/ffffff.jpg) and create 3 articles and use css "image-left" as align for intro images in options of menu item. You want one column. Than display frontpage.

Expected result

Text (H1 + article details + article intro text) will be right behind the intro image (~20 px far)

Actual result

Text (H1 + article details + article intro text) is far away (~190 px far) from intro images

System information (as much as possible)

blank install of Joomla 4.4.8, PHP 8.1.17, 10.4.24-MariaDB, Apache/2.4.53 (Win64) OpenSSL/1.1.1n PHP/8.1.17

Additional comments

• Not correct alignment of text to smaller intro images (e.g. 200x200 px, one column). Solution is to remove "flex" for (.image-left .blog-item .item-image), same for featured articles blog and category blog

• CSS "image-left" or "image-right" works only for menu item, if is added to "blog layout" (menu item options) for "Leading Article Class" and "Article Class". Text is not correctly aligned on front page if is "image-left" added to "article options" (in this case is text under image and not at right/behind of intro image)

• in Cassiopeia template is missing "text area" for custom css code. External css file is not handy.

• in Joomla 2.5 and 3.5 was option to chose from "left-right-none" for image alignment. This was excellent, because it worked in every template. Now J4 and J5 has only text area for CSS style. But this is often ignored by many template developers, is hard to find correct CSS styles, furthermore, it is not working correctly (e.g. Cassiopeia template for CSS "image-
  left")

• Joomla user should have option to chose from, if he/she want to add CSS class or select offered predefined alignment as was in J 3.5 ("left-right-none")

• please fix correct alignment for smaller images in blog layouts (featured blog and category blog)

• Cassiopeia template should remove as much as possible of CSS Grid and FLEX, because it only complicates customizing of this template. Bootstrap 5.3 is good enough to solve any layout possibilities, or not?

[radik10]

---

_{This comment was created with the J!Tracker Application at issues.joomla.org/tracker/joomla-cms/44242.}

[chmst]

This is not an issue of Cassiopeia. You can style your layouts as you want, with own classes or in your user.css or via an override.