Jump to content
Search In
  • More options...
Find results that contain...
Find results in...
Advanced Search
  • 0

How to change image % in image card block (7.1)


LaurenZA
Go to solution Solved by tuanphan,

Question

Site URL: https://flashactsfestival.org/

Hi Everyone!

I'm working on this specific page: 
https://flashactsfestival.org/gorn-galaxy
PW: FAF2020

I want to adjust the percentage of horizontal space the image takes up compared to the text. Ideally, instead of 50%, I would like the image to take up 30%.

I feel like this used to be a feature in 7.0? But now I cannot find it in either 7.0 or 7.1.

Hoping someone can help me with the CSS for this. 


Thank you!

Lauren

Edited by LaurenZA
better title
Link to post
  • Answers 9
  • Created
  • Last Reply

Top Posters For This Question

Top Posters For This Question

Posted Images

9 answers to this question

Recommended Posts

  • 0
On 9/12/2020 at 11:02 AM, tuanphan said:

Add to Page Settings > Advanced > Header


<style>
  @media screen and (min-width:768px) {
  .design-layout-card .intrinsic {
    width: 30% !important;
}
  }
</style>

 

@tuanphan, I used this code in the Custom CSS section with the specific block image ID— is there a line I can add to make the image centered in its "column"? Right now the image is at 30% width, but it's aligning to the right, like in the screenshot.

I would like to make it so that the image is smaller and that both text and image are centered within the image card block, would you be able to help?

Screenshot 2020-10-04 at 5.34.42 PM.png

Link to post
  • 0
10 hours ago, lizmak said:

@tuanphan, I used this code in the Custom CSS section with the specific block image ID— is there a line I can add to make the image centered in its "column"? Right now the image is at 30% width, but it's aligning to the right, like in the screenshot.

I would like to make it so that the image is smaller and that both text and image are centered within the image card block, would you be able to help?

try

margin: 0 auto !important;

You can send your question to my email to get detail answer. / How to Setup Password & Share URL 

-- I'm seriously sick. Off some time.

Link to post
  • 0
19 hours ago, lizmak said:

it's https://lizmak.io/intl-sos-assistance-app/ and the password is mizupizu. I'd like to make it so that the name of the organization (Intl SOS) appears on one line.

Add to Page Settings > Advanced > Header

<style>
  @media screen and (min-width:768px) {
  .design-layout-card figcaption.image-card-wrapper {
    width: 70% !important;
}
  }
</style>

 

You can send your question to my email to get detail answer. / How to Setup Password & Share URL 

-- I'm seriously sick. Off some time.

Link to post

Create an account or sign in to comment

You need to be a member in order to leave a comment


×
×
  • Create New...