Increase font size with JavaScript around fixed floated images in CSS columns

后端 未结 3 715
温柔的废话
温柔的废话 2021-01-21 09:44

I was searching for an html page, where i can acquire Font size of a text in a div to be increased using javascript and at the same time an image placed in that div should not b

3条回答
  •  情书的邮戳
    2021-01-21 10:13

    If you add a style attribute to the div that contains the image to position it absolute, that might solve your problem.

    HTML snippet:

    The header of the columns

    Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Nulla at turpis eget nibh ultricies dignissim. Duis luctus euismod turpis. Mauris augue. Aliquam facilisis semper elit. Pellentesque semper hendrerit arcu. Phasellus eleifend commodo justo. Aliquam orci urna, imperdiet sit amet, posuere in, lobortis et, risus. Integer interdum nonummy erat. Nullam tellus. Sed accumsan. Vestibulum orci ipsum, eleifend vitae, mollis vel, mollis sed, purus. Suspendisse mollis elit eu magna. Morbi egestas. Nunc leo ipsum, blandit ac, viverra quis, porttitor quis, dui. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Vivamus scelerisque ipsum ut justo. Pellentesque et ligula eu massa sagittis rutrum. In urna nibh, eleifend vel, suscipit ut, sagittis id, nunc.

    Nam ut sapien sed pede pulvin

    CSS:

    .imagediv{float:left; margin-top: 30px; padding: 3px; }
    

    Is this what you are looking for ?


    The way to make text go around an image is by setting the style attribute "Float" on that image, or a surrounding element, like a div.

    If you see that the image is changing position because the size of the text above the image increases, then that is just because that's how HTML works.

    The position in the HTML is important to determine where to show your element on the rendered webpage.

    With the information you gave, it is not clear enough how it should be. The code I provided lets the text go around the image, however the text ABOVE the div, or at least the image tag, will cause it to be pushed down.

    There is, though, one possibility that would allow you to do such a thing, but it reaches beyond my skills, and that would be to remove the image with Javascript, and insert it back at a higher place in the HTML.

    I hope I gave you enough information for you to think about a solution.

提交回复
热议问题