CMS Development

micheleguilford
Teilnehmer/-in

Rectangular image appearing oval

lösung

I'm working in an accordian fold module, the last of 7. In every other accordian, the image that I've added into the rich text content box has rendered as uploaded - rectuangular. This one is messing with me. It's rendering OVAL. 

 

I've been through the module, content code, page code, there is nothing different. I've even deleted the module and recreated it. Still oval. How do I make it render rectangular, as the original image was uploaded?

 

 

0 Upvotes
1 Akzeptierte Lösung
tjoyce
Lösung
Trendsetter/-in | Elite Partner
Trendsetter/-in | Elite Partner

Rectangular image appearing oval

lösung
 

Do 1 of the 2 following things to fix this:

 

1. In your stylesheet add the following code

body .full-fold-container img {border-radius:0;}

OR 

2. In your wysiwyg, go to the HTML view and add the inline style of

style="border-radius:0;"

as an attribute on your <img tag

 

The style is coming from this file https://www.edtscyber.com/hs-fs/hub/4108099/hub_generated/template_assets/1524608010313/Custom/page/... where you find the definition: 

 

.full-fold-container img {
    right: 15px;
    border: 1px solid rgba(0,0,0,0.15);
    border-radius: 50%;
    transform: rotate(180deg);
    float: right;
}

 The 50% that I colored red is the problem. It should be 0

Lösung in ursprünglichem Beitrag anzeigen

0 Upvotes
4 Antworten
tjoyce
Trendsetter/-in | Elite Partner
Trendsetter/-in | Elite Partner

Rectangular image appearing oval

lösung

I think we need to see some code to try and help you out, is the page published or staged so we can inspect the code?

0 Upvotes
micheleguilford
Teilnehmer/-in

Rectangular image appearing oval

lösung
0 Upvotes
tjoyce
Lösung
Trendsetter/-in | Elite Partner
Trendsetter/-in | Elite Partner

Rectangular image appearing oval

lösung
 

Do 1 of the 2 following things to fix this:

 

1. In your stylesheet add the following code

body .full-fold-container img {border-radius:0;}

OR 

2. In your wysiwyg, go to the HTML view and add the inline style of

style="border-radius:0;"

as an attribute on your <img tag

 

The style is coming from this file https://www.edtscyber.com/hs-fs/hub/4108099/hub_generated/template_assets/1524608010313/Custom/page/... where you find the definition: 

 

.full-fold-container img {
    right: 15px;
    border: 1px solid rgba(0,0,0,0.15);
    border-radius: 50%;
    transform: rotate(180deg);
    float: right;
}

 The 50% that I colored red is the problem. It should be 0

0 Upvotes
micheleguilford
Teilnehmer/-in

Rectangular image appearing oval

lösung

You are awesome! That worked beautifully.

 

Thank you!

Michele