Centering method of the image
Permalink Browser Info Environment
I am a beginner.
I want to place the image of the image block in the center.
How do I.
I want to place the image of the image block in the center.
How do I.
Type: | Discussion |
---|---|
Status: | In Progress |
Hi, Jordi.
It was completed! Thank you very much!
In the next update, we expect editing functions of the image (the ellipse, rounded corners, etc).
HIdehiko MICHIHIRO
It was completed! Thank you very much!
In the next update, we expect editing functions of the image (the ellipse, rounded corners, etc).
HIdehiko MICHIHIRO
Hi!
First, thanks for the review :)
I will add additional classes in the next update for circle and rounded images.
Regards,
Jordi
First, thanks for the review :)
I will add additional classes in the next update for circle and rounded images.
Regards,
Jordi
Hi,Jordi
After installing to 8.0.3, it became like this. what should I do?
Hidehiko MICHIHIRO
After installing to 8.0.3, it became like this. what should I do?
Hidehiko MICHIHIRO
Hi Hidehiko,
can you send me a link to your site so I can have a look?
Does this happen only when you're logged in? Is the website ok if you visit it as a visitor (with a different browser)?
Jordi
can you send me a link to your site so I can have a look?
Does this happen only when you're logged in? Is the website ok if you visit it as a visitor (with a different browser)?
Jordi
Hi, Jordi. Thank you for your reply.
My website address is "http://melodious.jp/"
The phenomenon is the same for Chrome, Safari and FireFox.
Ask you.
My website address is "http://melodious.jp/"
The phenomenon is the same for Chrome, Safari and FireFox.
Ask you.
Hi!
It seems you added a CSS rule in the main.css file. In line 6, you have this:
This is not included in the theme, so you probably added this at some point. Can you try removing that or installing a fresh copy of the theme?
Regards,
Jordi
It seems you added a CSS rule in the main.css file. In line 6, you have this:
width: 960px;
This is not included in the theme, so you probably added this at some point. Can you try removing that or installing a fresh copy of the theme?
Regards,
Jordi
Hi, Jordi.
The problem was settled.
Thank you very much.
Hidehiko MICHIHIRO
The problem was settled.
Thank you very much.
Hidehiko MICHIHIRO
Thank you so much, very clear instruction for newb.
Hi Jordi,
I have a few images at the bottom of my first page that i am trying to centre using this method.
I have copied the code:
.center-image img {
display: block;
margin-left: auto;
margin-right: auto;
}
into my design>themes>customize>CSS
and then add the custom class center-image to the image but the images are not moving into the center of the blocks.
Any suggestions?
Cheers,
Athan
I have a few images at the bottom of my first page that i am trying to centre using this method.
I have copied the code:
.center-image img {
display: block;
margin-left: auto;
margin-right: auto;
}
into my design>themes>customize>CSS
and then add the custom class center-image to the image but the images are not moving into the center of the blocks.
Any suggestions?
Cheers,
Athan
Hi Jordi,
All sorted.... my code in the CSS was a bit off :(
All sorted.... my code in the CSS was a bit off :(
you have 2 options:
A) Click on the Gear Icon in the toolbar, select Design -> Theme -> Customize, and paste the following code into the Custom CSS area:
This will create the class "center-image", that you can add to any image block to make it centered.
So now you only need to click on the Image Block, choose "Design & Custom Template", click on the Gear Icon and enter the following custom class: "center-image" (with no quotes).
(I will add this class in the next version of the theme to make it easier to center image blocks).
B) You can add the image using a Content Block (instead of an image block). If you insert an image using a Content block, the image will be centered by default (but it will not be responsive).
Please let me know if you have any further questions,
Jordi