- This topic is empty.
February 7, 2013 at 10:07 am #42550
Say I have a div say called leftcolumn which inside I have two text headings aligned just left of centre.
I want to put an image on the right hand side of those headings still within the leftcolumn.
The image because of its width goes right but beneath those headings not alongside them.
I have come to the conclusion this is because the width of my image obviously encroaches on those headings and therefore has to fall beneath.
I want it there however so that part of the headings reach and overlap that image. How can I do this?
I’ve given you a visual idea below as to what its currently doing (not what I want ha).
Do I have to create say a div for that image to do what I want? Pretty stuck and I’m struggling to understand what I think i may need to do – Absolute positioning? Could you please help in real simple terms as it seems I have an IQ of a tin of soup. Thankyou
MY IMAGE MY IMAGE MY IMAGE MY IMAGE MY IMAGE
MY IMAGE MY IMAGE MY IMAGE MY IMAGE MY IMAGEFebruary 7, 2013 at 10:14 am #123657
If you change the display property of this particular heading to ‘inline-block’ does that solve the problem?
If you want the heading to ‘overlap’ the image then some sort of positioning will need to be used.
If you have an image of what you are trying to achieve it would be very useful.February 7, 2013 at 10:21 am #123658
definately want the heading to overlap the image. I can try to explain my effect better for you however. I am just practicing for now and I got a picture off dreamstime of a man with a white background running. Beens as my webpage is white, I want the heading to overlap the white background of the image and come not far from the runners head.February 7, 2013 at 10:27 am #123660
I think you can do it: http://codepen.io/Paulie-D/pen/nLvwE
Frankly, I am uncomfortable with using absolute positioning quite that much but if needs must….February 7, 2013 at 10:28 am #123661
I think I may have done it using position relative, bottom, 100pxFebruary 7, 2013 at 10:31 am #123662
I see how you have done it through putting positioning properties on leftcolumn the heading and the image. I just used position relative on my image like I mentioned above. Is this okay?February 7, 2013 at 11:05 am #123668
Hey, if it works then that probably good enough.
Your current fix will probably only work for one instance though, it might not work if you had many iterations of different images / headings.
Without seeing the site in question it’s hard to comment further.
- The forum ‘CSS’ is closed to new topics and replies.