Home Forums Archived Forums Not Theme Related Text over image

Viewing 4 posts - 1 through 4 (of 4 total)
  • Author
    Posts
  • #18107
    thinkordream
    Participant

    Hello

    How do I place text over an image(in the body as opposed to in the header) like in tyler.com ? There were some hints in the forum pages about using CSS in the Advanced Options / <Head> Section. I could not understand the cryptic hints. Could someone provide a step by step instructions on how we could achieve that? Thanks.
    #23811
    Weaver
    Keymaster

    This is VERY hard to do correctly.

    The “standard” way is to use absolute positioning.

    The real problem (and it is a problem and should NOT be ignored), is that using standard CSS to try to accomplish this is not responsive – the text gets all screwed up on smaller screens and looks awful.

    The best solution in our experience is to use a photo editor and place the text over the images. This doesn’t work well if you have constant text with changing images.

    But, this is not really theme related, but is an HTML/CSS/JavaScript issue. Weaver allows you to have “raw” pages if you need a bunch of specialized HTML, but that is the extent of theme help for this sort of styling issue.

    #23812
    scrambler
    Moderator
    So the basic HTML would look like
    <div style=”position:relative;float:left;”><img src=”imageurl”/>
    <div style=”position:absolute;left:5%;top:5%;”>Your text</div>
    </div>
    #23813
    thinkordream
    Participant

    Many thanks for your help. It works!

Viewing 4 posts - 1 through 4 (of 4 total)
  • The forum ‘ Not Theme Related’ is closed to new topics and replies.