YOOtheme Pro is here! The best WordPress and Joomla theme. Learn more

Avatar hendrik.meyer.12 asked

Image in Cookbook / UIkit 3

Hello,

how can I place the image into the layout of Cookbook / UIkit 3 that under the picture the text over the entire width is to be seen?
Image

  • ZOO
  • UIkit

3 Answers

0

Avatar florian Yootheme answered

You will need to change the markup, so that the text and image are not displayed in 2 columns next to each other, but instead that the image floats inside the text.

This is a simplified example, but I hope you get the general idea:

Change from this:

<div class="uk-card uk-card-default uk-card-body">  
    <div class="uk-align-right@m">  
        <div id="wk-grid791" class="wk-grid-width-1-1 wk-grid wk-grid-match " data-wk-grid-match="{target:'> div > .wk-panel', row:true}" data-wk-grid-margin="">  
            <figure class="wk-overlay wk-overlay-hover ">  
                <img src="/media/widgetkit/eucerin-allergie1-64e2291bb36d77b9a45fd2153b71be54.jpg" class="wk-overlay-scale" width="350" height="350">  
                (...)  
            </figure>  
        </div>  
    </div>  
</div>

<div class="uk-overflow-hidden">

    Blühende grüne Landschaften sind ein schöner Anblick. Für 16 %* der Deutschen bedeuten sie aber: Achtung, Pollenalarm! Was viele Allergiker nicht wissen: (...)  
</div>

...to something like this:

<div class="uk-overflow-hidden">

    <figure class="wk-overlay wk-overlay-hover uk-float-right uk-margin" >

        <img src="/media/widgetkit/eucerin-allergie1-64e2291bb36d77b9a45fd2153b71be54.jpg" class="wk-overlay-scale" width="350" height="350">  
        (...)

    </figure>

    Blühende grüne Landschaften sind ein schöner Anblick. Für 16 %* der Deutschen bedeuten sie aber: Achtung, Pollenalarm! Was viele Allergiker nicht wissen: (...)  
</div>

Edited

0

Avatar hendrik.meyer.12 answered

Hi Florian,
that works well, it is missing the Finetuning. Thank you!
Too bad that your zoo module and Yootheme pro is almost useless ...
Much worse is that this site is now broken by an update of Yootheme Pro.

I wish me a fast solution, since other sides of me are defective (live sites !!!)
See here: http://yootheme.com/component/answers/question/112785](http://yootheme.com/component/answers/question/112785)

0

Avatar hendrik.meyer.12 answered

Hi Florian,
that works well, it is missing the Finetuning. Thank you!
Too bad that your zoo module and Yootheme pro is almost useless ...
Much worse is that this site is now broken by an update of Yootheme Pro.

I wish me a fast solution, since other sides of me are defective (live sites !!!)
See here: http://yootheme.com/component/answers/question/112785](http://yootheme.com/component/answers/question/112785)

Know someone who can answer? Share a link to this question via email or twitter.