overlapping image in footer

  • orangeblowfish

    (@orangeblowfish)


    13 years ago

    I am trying to add a footer image to my website so that it is aligned to the right on the same line with the company info and so that it overlaps into the bottom of my pages. at the moment it sits on top of the company info line

    http://www.jitterbugsinshanghai.com

    can you help and advise what i should do to make this happen as i have seen other sites that have overlapping images

    http://www.monkeymusic.co.uk

Viewing 5 replies - 1 through 5 (of 5 total)
  • kjodle

    (@kjodle)

    13 years ago

    Add to child theme stylesheet:

    .colin img {
    bottom: 150px;
    position: relative;
    z-index: 20;
}
    Thread Starter orangeblowfish

    (@orangeblowfish)

    13 years ago

    Hi Kjodle i tried this and it didnt work. i play ed with the code a bit and ended up having the image overlapping the page a bit but it is at the bottom of the page now and isnt aligned to the center

    .colin img {
    position: absolute;
}

    any assistance would be much appreciated

    Thread Starter orangeblowfish

    (@orangeblowfish)

    13 years ago

    I also added some extra lines of code which now makes the image hover to the left however on different screen sizes he hovers in different positions. 

    .colin img {
	bottom: -260px;
   left:200px;
    position: absolute;
    z-index: 4;
}

    how can he fixes him to the left edge of the page

    zebrawebdesigns

    (@sbhuvan)

    13 years ago

    @orangeblowfish

    Try the code below and paste it at the end of your stylesheet

    .colin{
position:absolute;
height:100px;
}
.colin img{position:absolute;
top:-110px;
left:10px

}
.colin .site-info{
position:relative;
left:350px;
}
#colophon {
    overflow: hidden;
    padding: 11px 0 52px;
    text-align: center;
}
    zebrawebdesigns

    (@sbhuvan)

    13 years ago

    @orangeblowfish

    I have checked your website. It seems my code helped you. If your problem resolved please reply back. and mark the issue as resolved

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

The topic ‘overlapping image in footer’ is closed to new replies.