-
Posts
-
Hi,
to begin, just saying that it’s shame that you don’t have a advanced search tool on your forum. Because, it’s to hard to find an old answer so users prefers post the question again. Not very good.Anyway my question is about the blog post function with the grid layout view.
I can’t change the spaces between colomns and most important I can’t show my image in full width. Worse my images are smaller than the text as you can see here :Even if I change the size of the image in the setting or the true image size nothing change with the size, only the resolution.
How can I configure the size of image and width of spacing between colomns ? It’s not normal to have to do that with CSS !
With the same feature I also have probleme with title text which don’t fit in it ones column when the windows is smallest. Worse the text is under itself. (you can see right now because I change the mobile view to 1 colomn to avoid this behaviour)
Regards,
PMPHey Pierre-Marie,
Thanks for your patience and the link to your site, I see that you have chosen your images to be 257px wide, this is why that are smaller that the column
choosing another option such as portfolio 495px will correct, I did this for you and now the images are the same width as the columns, please check.
The margin between the columns is 6% by default and there is not a option in the element to change this, but you can use css to adjust, I recommend adding a custom class such as smaller-margin to the blog post element so your customization doesn’t effect other elements on your site
and then you would need to adjust the margin and column width like this example for a 2% margin:.smaller-margin .slide-entry.av_one_fourth { width: 23.5%; } .smaller-margin .slide-entry.av_one_fourth:not(.first) { margin-left: 2%; }and add it your your Enfold Theme Options ▸ General Styling ▸ Quick CSS field, I did this for you, please check and adjust to suit.
Best regards,
MikeHello,
Even if I choose portofolio size, it doesn’t change anything it’s only the margin CSS field which change the size of the image.
As you can see here https://compagniethalie.org/programmation-previsu/
Also I don’t understand why the image size option is not opperant.Thank you for the margin CSS code even if I wrote at beginin that “It’s not normal to have to do that with CSS !”
The margin for the ok column, but the size of an image in a column, this should not be defined with CSS I think.
Anyway it’s works.But there is still a problem why the text passes through the column when the width of the page is narrowed.
See picture.
Regards
Hi,
Thanks for the feedback, for desktop screens the image and text shows correctly:
for tablet like your screenshot your long words could use word brakes, that this not enabled by default with this css
Try this CSS in your Enfold Theme Options ▸ General Styling ▸ Quick CSS field:.slide-entry .slide-entry-title { word-break: break-word; overflow-wrap: break-word; white-space: break-spaces; }After applying the css, please clear your browser cache and check.
Best regards,
MikeIt works thank you very much.
It is a simple way to change the size of the fonts (wrap them) instead of break words ?
Hi,
If you want to try it you could use this css instead:#top .slide-entry .slide-entry-title { word-wrap: break-word; }After applying the css, please clear your browser cache and check.
Best regards,
MikeI try it but it does the same result as your fisrt solution, the text is not wrap with a size changing. It’s purehaps not possible.
- You must be logged in to reply to this topic.