I have an image on which I want to place some text. I got the text placed as I wanted by using som code which I found here on Stack Exchange. However the text moves away if I change screen size. So my question is now, how do I fix the text so that it stays put.

I have seen some talk about using background-image, but I can't get this to work.

I don't have access to any developer tools, so I am adding the code to the HTML editer on the SharePoint page


  • Can you share your code?
    – newbie
    Commented Aug 16, 2017 at 8:19
  • 2
    You will need to understand CSS and the different ways of positioning elements in relation to other elements on the page. If the text moves when the screen size changes, then it is not relative to the correct element.
    – teylyn
    Commented Aug 16, 2017 at 8:54

2 Answers 2


Add some CSS to your code.

Firstly i would advise wrapping your text in a <div id="someText">

Create a class for your div where the size (width / length) is at least 5px shorter than the size of your image. (This will leave you some room for padding!)


Using JQuery + javascript

function resizeText(){
    var img = document.GetElementById('Image')
    var x = img.clientHeight
    var y = img.clientWidth    
    $('#someText').style('height:' + X + ';width:' + y + ';!important')


  • This should resize your div size containing your text as your window is made smaller / larger. Commented Aug 16, 2017 at 12:26

In addition to other answers, you can try using some modern CSS by implementing media queries to make your visuals change when the screen gets bigger or smaller. Try looking up "media queries" in your favorite search engine and you should get plenty of results on different usages.

Here is a simple example usage that I grabbed off of developer.mozilla.org:

<!-- CSS media query on a link element -->
<link rel="stylesheet" media="(max-width: 800px)" href="example.css" />

<!-- CSS media query within a stylesheet -->
@media (max-width: 600px) {
  .facet_sidebar {
    display: none;

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.