Admittedly, i have a large screen maximized but I see on some of the images a blank / black space to the right of the image
https://goldbuyer.com I don't see a way to limit the width in the dialog box. The first image seems to set the stage. All the images are about the same width though. Any ideas?
images not centered in IR magic 2
(6 posts) (3 voices)-
Posted 10 months ago
-
The IRM2 system is designed to auto fit into which you insert it, it occupy the full width of the element. If you want to limit the width that the system occupies you can add a simple style rule:
Open the p7IR2-01.css style sheet, or your page style sheet... it doesn't matter) and add this style rule:
#p7IR2_1 {
max-width: 1200px;
margin: 0 auto;
}Adjust the 1200px width to suit your needs, the margin line centers the IRM2 within its container.
Posted 10 months ago -
Gerry, I want it to be full image, but the second and third images are left aligned and don’t go full width. Now I have expanded my browser to almost the full width of my 27” monitor and it shows up then, but not at 1400px and under. I see that div.p7ir2-slide hast left: 0 and computed style says position: absolute, but I don’t see position absolute in the CSS anywhere. when I remove left :0 in inspector it doesn’t center the image location.
Posted 10 months ago -
Sinclair
offlineMemberI want it to be full image
You could try this in your p7IR2-01 style sheet
#p7IR2_1 img{
width:100%;
}HTH
Posted 10 months ago -
I misunderstood your goal, Sinclair's suggestion is spot on. To have the IRM2 image go full width in a Harmony container we just need to over-rule the Harmony image width: auto setting. You can use the rule Sinclair suggested or just add the !important directive to the image rule in the IRM2 style sheet:
Open the p7IR2-01.css style sheet and locate this style rule at line 55:
.p7ir2-image {
display: block;
border:0;
width: 100%;
height: auto;
max-width: 100%;
}change the width rule to this:
width: 100% !important;
so that it now looks like this:
.p7ir2-image {
display: block;
border:0;
width: 100% !important;
height: auto;
max-width: 100%;
}Posted 10 months ago -
Sinclair
offlineMemberAdditionally, regardless of which method you choose, you might want to edit the column in which the the IR2 resides using the HMY interface and choose the No Padding option, that may better suit your design layout.
HTH
Posted 10 months ago
Reply
You must log in to post.