How to change widith predefined J4-Cassiopeia positions?

[souteasteurope]

Hi. Has anyone alreday tried to change with help of Child Template, the layout positions of the template Cassiopeia -J4, (example like position BOTTOM-A or BOTTOM-B from original predefined to another like width 1400), while keeping the text (content) in the same position as original.I want the background color cover the entire width of a certain section (position), without leaving any white margins on side "in my case white color"? Please see the photo for a better understanding (picture is just one example, I would like to change in different position as well - Like TOP-A or TOP-B).

It is possible to use a CSS command in the user.css file to override the default layout of prefixed position width?

[Pavel-ww]

It is possible to use a CSS command in the user.css file to override the default layout of prefixed position width?

Hi. Yes, of course this is possible. Always provide URL when you ask questions related to changing the appearance of the layout. No one will reproduce your case to answer you and no one knows the code by heart, even its developer.

[Per Yngve Berg]

Mod. Note: Relocated the topic to the Templates Forum.

[Per Yngve Berg]

You can set the Template in Fluid Mode. Have you tried that?

[souteasteurope]

You can set the Template in Fluid Mode. Have you tried that?

Thank you so much for the answer and suggestion Mr. Per Yngve Berg. Unfortunately Fluid Mode is not a solution, because when I change to Fluid mode Cassiopeia Template - J4, all the content goes out of the line, i.e. text, titles, the whole website should be corrected then.

[souteasteurope]

It is possible to use a CSS command in the user.css file to override the default layout of prefixed position width?

Hi. Yes, of course this is possible. Always provide URL when you ask questions related to changing the appearance of the layout. No one will reproduce your case to answer you and no one knows the code by heart, even its developer.

Unfortunately, I have it on localhost, I can´t provide URL, I am sending a couple of screenshots, if it will help for easier understanding. So, if I understood correctly, you can change the specific layout position with the help of commands in user.css, which means that it will not change the entire position layout of the predefined template, for example the "Breadcrumbs" position, for only specific page, where is determined specific module, like in my case. If that's true, then is so much better that I can change on a single page, a specific position with a specific module which is determinated on that position?

In this case would like that background color gray is full width, the content remains the same layout. Btw (this is a module SmartSlider on position Breadcrumbs, there are 2 modules SmartSlider on same position on specific page).

[Pavel-ww]

Unfortunately, I have it on localhost, I can´t provide URL, I am sending a couple of screenshots, if it will help for easier understanding.

Hi. There is no problem with the understanding of what you want. But screenshots will not help solve the problem. We need to look at your page using Dev Tools. Therefore, you should upload the site to a hosting. Many hosting companies offer a test period. In any case, when you want to receive help with such issues, you must provide a link. Sorry, but there is no other way to help you.

[leolam]

We need a site we can access online. Pavel is right. Without that it is all a wild guess and takes too much time

Leo

[souteasteurope]

Unfortunately, I have it on localhost, I can´t provide URL, I am sending a couple of screenshots, if it will help for easier understanding.

Hi. There is no problem with the understanding of what you want. But screenshots will not help solve the problem. We need to look at your page using Dev Tools. Therefore, you should upload the site to a hosting. Many hosting companies offer a test period. In any case, when you want to receive help with such issues, you must provide a link. Sorry, but there is no other way to help you.

Thank you for the answer Mr. Pavel. I totally understand!

[Von Barron]

Not sure what you want to acheive here but here is an option to explore:
- create a child template of Cassiopeia and open it
- edit the index.php file and add some Flex CSS classes to the positions you want to modify. Example: "d-flex justify-content-center" and additional CSS classes for the background colors.
- remove the "full-width" class where is not needed
- save and test your frontend