want to add small image to the left of my "site title". Theme: Manifest 1.01

  • I want to add a small loveheart, ( I already have the image, it will be just like the favicon i have added to my site already… ) to the left of my “site title”… I am very new at this and need step by step help please! but i learn fast and have some htlm and css experience…

    the website we are talking about is https://www.heartonmysleeve.com and i want to add a red loveheart exactly to the left of the title…

    I hope i am being clear, thank you so much in advance for your help…

    Warm Wishes,

    Xenia

Viewing 12 replies - 16 through 27 (of 27 total)
  • Thread Starter cielle

    (@cielle)

    i got rid of the / you suggested and it is still not working…

    Thread Starter cielle

    (@cielle)

    yes of course lockettpots, thank you so much for your help… enjoy your meal! and thank you theotherlebowski as well!

    jack randall

    (@theotherlebowski)

    you may have been right earlier, try

    h1.vcard .author { etc...}

    you may need to be more specific with how deep your going into the element.

    This worked on your site put at the end of your style.css file

    h1.vcard{
   background:transparent url('https://heartonmysleeve.com/wp-content/themes/manifest_v1.1/images/red-heart.png') no-repeat top left;

}

    The problem is your image is much too big and you are only seeing the white bit at the top. The image needs to be less than 38px high because that is the approximate size of your site title

    Thread Starter cielle

    (@cielle)

    thank you theotherlebowski, i tried what you suggest, it is still not working and it is very frustrating…

    Thread Starter cielle

    (@cielle)

    oh that is brilliant Locketpotts!! I think this is going to work, silly me, blushing, thank you, will get back to you asap, hopefully with great news!

    xx

    Thread Starter cielle

    (@cielle)

    YAY, that worked, thank you so much! Big hug and kiss ?, you are brilliant and such a sweety to help me…

    Now i will just play around with it as you suggested above, forgive my ignorance but if i wanted to move the heart along either to the left or the right how would i do that?

    xxx

    thank you also theotherlebowski for your help and interest…

    Instead top and left (equals 0px 0px) use values (10px 10px for example)

    the first value moves it right and the second one moves it down.

    you can’t move it to left because it would disappear out of the H1 ‘box’ but if you add padding-right to the rule it will move the title to the right giving the impression that the heart has moved left

    Thread Starter cielle

    (@cielle)

    brilliant, thank you, i will look into that and get back to you if I may if i have any problems… I shouldn’t do…

    I need to eat some food now myself… I hope you had enough to eat and enjoyed it or are enjoying it yourself…

    Sorry it should be padding-left but I don’t think this will work.

    OK

    padding-left works
    try padding-left: 50px;

    So the whole rule now looks like

    h1.vcard{
   background:transparent url('https://heartonmysleeve.com/wp-content/themes/manifest_v1.1/images/red-heart.png') no-repeat top left;
   padding-left: 50px;
}
    Thread Starter cielle

    (@cielle)

    brilliant, thank you so much, that looks perfect… I was playing around with all sorts of options but this one that you suggest now looks best finally I think…

    You are very sweet to help me so much… xx

Viewing 12 replies - 16 through 27 (of 27 total)
  • The topic ‘want to add small image to the left of my "site title". Theme: Manifest 1.01’ is closed to new replies.