Web Analytics Made Easy -
StatCounter right/bottom aligned div or image with text wrap? - CodingForum

Announcement

Collapse
No announcement yet.

right/bottom aligned div or image with text wrap?

Collapse
X
 
  • Filter
  • Time
  • Show
Clear All
new posts

  • right/bottom aligned div or image with text wrap?

    hey all

    is there any reliable css way to get a div or a transparent image to be aligned to the right and to the bottom of a parent div, with a text-wrap? kinda like this:



    if i use float:right the text wraps, but the box won't be at the bottom; if i use position: absolute i can get it to stick to the bottom and the right, but the text won't wrap.

    the only solutions i've seen so far involve manually inserting an image somewhere near the end of the text, but that's a fairly nasty, unelegant botch. does anyone have a lovely solution?
    Last edited by lawrie; Oct 5, 2006, 10:56 AM.
    you are invited | http://www.indextwo.net

  • #2
    Found this, may be of use:

    http://www.xs4all.nl/~jer03n/sandbox...tom-right.html

    It's messy though and requires JavaScript.
    Last edited by mark87; Oct 5, 2006, 02:26 PM.
    markaylward.co.uk

    Comment


    • #3
      position: relative maketh not a ha'penny worth of difference defining the right & bottom values in the css makes no difference to it's actual positioning inside a div; it just sits like a lump on the top left. defining the top & left values using position:relative moves the vox accordingly, but i end up with the same result as position:absolute (the text doesn't wrap).

      just for reference, here's the non-working coding i'm using at the moment:

      Code:
      .clearbox {
      width:	94px;
      height:	92px;
      position:	relative;
      top:	108px;
      left:	171px;
      }
      you are invited | http://www.indextwo.net

      Comment


      • #4
        holy crap - that is messy. it's a lot more than i've managed to find in a couple of hours searching, though. thanks for that.

        i've found a lot of similar posts from people on loads of different forums, but it really seems like there's no css-based solution. that's ever so frustrating :/
        you are invited | http://www.indextwo.net

        Comment


        • #5
          This site has a 'boxpunch' solution. See if you can adapt it to your requirements:

          http://meyerweb.com/eric/css/edge/boxpunch/demo.html

          Comment

          Working...
          X