[Résolu] Data inside the same row placed in cells next to each other displayed vertically
This support ticket is created Il y a 6 années et 7 mois. There's a good chance that you are reading advice that it now obsolete.
This is the technical support forum for Toolset - a suite of plugins for developing WordPress sites without writing PHP.
Everyone can read this forum, but only Toolset clients can post in it. Toolset support works 6 days per week, 19 hours per day.
No supporters are available to work today on Toolset forum. Feel free to create tickets and we will handle it as soon as we are online. Thank you for your understanding.
I am trying to: Display data next to each other in a horizontal manner. I have created a row and placed data in 3 cells next to each other. But the data is displayed one below the other instead of getting displayed next to each other.
Link to a page where the issue can be seen: hidden link
I am using a child theme.
I created a folder named 'assets' inside the child theme.
Then created a folder named 'css' inside the assets folder.
Then I created a file named flatsome.css inside the 'css folder.
Then I simply added the exact code in the flatsome.css file and commented out the code you mentioned.
Is it possible for you to send me access details of your site?
*** Please make a FULL BACKUP of your database and website.***
I would also eventually need to request temporary access (WP-Admin and FTP) to your site. Preferably to a test site where the problem has been replicated if possible in order to be of better help and check if some configurations might need to be changed.
I would additionally need your permission to de- and re-activate Plugins and the Theme, and to change configurations on the site. This is also a reason the backup is really important. If you agree to this, please use the form fields I have enabled below to provide temporary access details (wp-admin and FTP).
I have set the next reply to private which means only you and I have access to it.
The columns in the row are not equally divided in 6 parts. The columns are left aligned. It does not appear like a equally spaced 6 column grid.
Also, if I add an image, the image is displayed full width and it is not contained / restricted to the size / width of the cell. Please have a look here: hidden link
Well - I think you do not understand how to use Toolset grid layout. I see you have added 6 visual editor cells to your layout and each visual editor contains the image and title.
Now, I would like to know - what content you want to display - I mean from which custom post type you want to display the content?
I suggest you should create a test site on our test platform discover-wp.com and try to learn how layouts are created. You can use any existing reference sites we offer that will help you immensely.
=> hidden link
=> hidden link
I had added the 6 cells only to see how content is placed next to each other in a row. I was not trying to design / display a view.
I want to design a layout template for the custom post type 'Places'.
Now, In the layout template I have added 2 rows.
In the first row, I have only added the post title.
In the second row I have added 2 cells next to each other. The cell on the left side contains the featured image. The cell on the right side contains the post body.
I want the featured image and post body to be displayed in two columns next to each other. But currently, they are displayed one below the other. I want to fix this.
Please have a look here: hidden link
Please let me know if I am doing something wrong here. Please let me know.
Well - the issue is from your theme file and the same code I shared before that breaks the bootstrap output.
.row>div:not(.col) {
width: 100% !important;
}
Above CSS does exactly nothing but breaking Bootstrap.
I mean: that theme you are using has its own grid system. This is what our CSS expert told me that the theme author we assume probably meant: apply grid system only if small-6 (equivalent of Bootstrap's clo-sm-6) is used along with class ".col" But this makes no sense because his columns use: max-width and his :not(.col) reset uses "width". Max-width is much more important than "width" even with all these !importants.
So… I know this is bad, but I would recommend editing original theme (I know…) and change this:
If you want I can make changes to your file but first I need your permission.
AND:
write to the theme author that he should make above changes in his original theme because this is what he probably meant originally.
This way: the original theme will work properly and there will be no conflict with Bootstrap.
Doing such a change (or any other) in child theme won't work unfortunately.
1) I have written to the theme developer and requested him to make changes as suggested by you.
2) I have made chances to the css file flatsome.css under the 'assets' folder in the theme - as you had mentioned, but there is no change. Can you please have a look?
Also please go ahead and make the changes. After you do the changes, please also let me know the exact step for the same, so that I can do it on my own next time / if there is a theme update.
Thanks a lot for all the help. I appreciate the awesome support.
It looks like the theme author has fixed this issue in the latest version. Can you have a look now please? I have updated the theme to the latest version.
