[Pages] image float in records

[Axel Wers]

When I use record's image, in record text (display content) is bottom of image.

Like this:

 

Text text Text text Text text Text text Text text Text text Text text Text text Text text Text text Text text Text text Text text Text text Text text 

Text text Text text Text text Text text Text text Text text Text text Text text Text text Text text Text text Text text Text text Text text Text text 

 

But I want this

 

 Text text Text text Text text Text text Text text Text text Text text Text text Text text Text text Text text Text text Text text 

 

In Templates → HTML → Display → record I found this

        {{if $record->record_image}}
            <div class="cCmsRecord_image">
                <img class="ipsImage" src="{file="$record->_record_image_thumb" extension="cms_Records"}">
            </div>
        {{endif}}

I added float: left

        {{if $record->record_image}}
            <div class="cCmsRecord_image">
                <img style="float: left" class="ipsImage" src="{file="$record->_record_image_thumb" extension="cms_Records"}">
            </div>
        {{endif}}

 

but didn't work. What is wrong?

 

[Sonya*]

Do not use style=. Try CSS Framework https://invisioncommunity.com/4guides/themes-and-customizations/css-framework/miscellaneous-r99/ instead. See Positioning.

 

[Axel Wers]

Didn't help. In IC 4.2 this worked automatically in records.

[opentype]

Yes, it should float automatically. If it doesn’t work for you, something in your theme might override it. But it’s completely impossible to tell unless you provide a link where we can see it happening. 

The code you showed in the first post also cannot work, since the image sits in the cCmsRecord_image container. Floating it INSIDE it won’t create a float in relation to the text. 

[Axel Wers]

It's original template without any changes.

I tried even this

        {{if $record->record_image}}
        <div style="float:left">
            <div class="cCmsRecord_image">
                <img class="ipsImage" src="{file="$record->_record_image_thumb" extension="cms_Records"}">
            </div>
            </div>
        {{endif}}
        <div style="float:right">
        <section class="ipsType_richText ipsContained ipsType_normal" data-controller='core.front.core.lightboxedImages'>{$record->_content|raw}</section>
        </div>

but without any effect, text is still bottom the image. I'll probably give it up, I tried everything possible and nothing.

[opentype]

50 minutes ago, Axel Wers said:

It's original template without any changes.

Exactly! That’s why we would need to see a page to check what else is interfering.