Float area not respected by su_note

  • Resolved David

    (@loano1)


    6 years, 2 months ago

    Hi,

    I added an image to my post and align it to the left, half the width. On the right side, text is floating. Now I added [su_note note_color=”#81ecbc” text_color=”#000000″] shortcode. In editor it only displays in the area right of the image but on the frontend, it colors the whole width, also the area behind the image. Screenshot: https://prnt.sc/rjweqr
    Thanks in advance for any help!

    The page I need help with: [log in to see the link]

Viewing 2 replies - 1 through 2 (of 2 total)
  • Plugin Author Vova

    (@gn_themes)

    6 years, 2 months ago

    Hi @loano1,

    the float is a pretty complex property in my opinion. What you see on your page is expected behavior. Here’s a detailed explanation of the problem:

    https://stackoverflow.com/a/37059685

    You can stick the note to the image by adding overflow:hidden to it. Follow the steps below.

    Add CSS class to your note:

    [su_note class="overflow-hidden"] ... [/su_note]

    Then go to Dashboard – Shortcodes – Settings and add the following snippet to the Custom CSS code field:

    .overflow-hidden {
  overflow: hidden;
}
    Thread Starter David

    (@loano1)

    6 years, 2 months ago

    Hi Vladimir,

    This perfectly solved my problem. Thanks a lot for your help!

Viewing 2 replies - 1 through 2 (of 2 total)

The topic ‘Float area not respected by su_note’ is closed to new replies.