Problem with image in text and mobile view

Support
#1

hi there,

i needed a pdf button beside a text and added an image in the text field. i made a image class in the text editor then set it absolute and did the positioning.
on desktop view it looks good.
but when i switch to mobile view the image is on the false position.
any help how to fix it so the image is positioning right from the text?

thanks in advance for your help.
images and credentials in the secure note.

cheers

#2

Hi Harald,

Thanks for reaching out.

That would require customization since it’s not responsive by default (the positioning). Have you tried using revolution slider(hero slider) to achieve this, it has responsive positioning that you can utilize, or this https://support.stylemixthemes.com/revolution-slider-responsive-settings

What I’m saying is, it’s too complex to re-create the responsive positioning that other plugins already has.

Thanks!

#3

hi rad,

its not a slider. it is a content in a section. how should i make that in revolution slider? i dont get it… :frowning:

i posted the url again in secure note where the problem ist. dont know if i had described it correctly…
scroll down to the bottle and then change the view from desktop to mobile… or did i something wrong? is there another way to archive this?

thanks! :slight_smile:

#4

Hello Harald,

Your custom css will not be good responsively. Please use this method:

  • Set a maximum width for the text element
  • Make set that is aligned at the middle by setting the left/right margins to auto
  • And then update your text content into this one instead:
<p><img src="https://cr68.com/kazi/wp-content/uploads/2019/05/pdf-icon-vector.png" style="margin-right: -70px" class="alignright" alt="" width="50" height="99" />zur produktliste:<br />
<strong>alkoholfreie<br />
getränke</strong></p>

If it is too wide, you can adjust the maximum width to 140.

We would love to know if this has worked for you. Thank you.

#5

hi!

thanks for your help! that is perfect! :slight_smile:

many many thanks for your great support!

cheers

#6

You’re most welcome!

#7

hi again,

now i have a similar problem with another content area.
i tried it with the code and instructions above. a little bit is working. but the triangle on mobile view is not where it is and on tab view it looks a little bit crippled…

any tipp or help how i can fix this?

added link in secure note

thanks and cheers

#8

Hi Harald,

May I know the password of the page? It’s behind a under construction page :slight_smile:

Thanks!

#9

oh sorry

of course :slight_smile:slight_smile:it is in the secure notes.

cheers

#10

Hi Harald,

It’s different this time as the triangle background is set as section’s background instead of the column. It can’t be fixed by above recommendation. Instead, please utilize hide during breakpoint feature to create different layouts for each device. Like you can hide and display specific section for reach device. Please check this https://theme.co/apex/forum/t/hide-during-breakpoint-explained/17378

Thanks!

#11

hi rad,

thanks for your reply. i know it is possible with hide during breakpoint feature.
but i do not want this because it should be very easy to change the content there.

so i did some css. now it looks quite good. just have to do last changes.

thanks again for your helo and awesome support.

cheers

#12

Glad we could help.

Cheers!

#13

This topic was automatically closed 10 days after the last reply. New replies are no longer allowed.