Clip Overflow, Vertical-Align Bottom...how do I do this?
Clip Overflow, Vertical-Align Bottom...how do I do this?
am 03.07.2007 07:29:23 von BeeRich
Hi folks.
Question for the gurus.
I have a box 200 wide, 200 tall. I insert text in there and it's
larger than the box. So I set overflow to hidden. The result is
text
that starts at the beginning, and the end of the paragraph is sliced
off at the end.
How do I shove this vertically, so that the beginning is cut off, and
the last parts of that text are shown, aligned to the bottom? The
length of this text will change, so I need a way of aligning it so
that the top part becomes hidden, not the bottom.
Any ideas?
Re: Clip Overflow, Vertical-Align Bottom...how do I do this?
am 03.07.2007 08:24:12 von Neredbojias
On Tue, 03 Jul 2007 05:29:23 GMT BeeRich scribed:
> Hi folks.
>
> Question for the gurus.
>
> I have a box 200 wide, 200 tall. I insert text in there and it's
> larger than the box. So I set overflow to hidden. The result is
> text
> that starts at the beginning, and the end of the paragraph is sliced
> off at the end.
>
> How do I shove this vertically, so that the beginning is cut off, and
> the last parts of that text are shown, aligned to the bottom? The
> length of this text will change, so I need a way of aligning it so
> that the top part becomes hidden, not the bottom.
>
> Any ideas?
There are ways to reverse text direction (rtl or ltr) but I don't know for
sure if they can be applied to a single element. Furthermore, the lines
would probably still go from top to bottom, but I'd experiment to see what
I could come up with.
--
Neredbojias
Never doubt
The path you've chosen.
If others mock,
Just thumb your nosin'.
-Burma Shave
Re: Clip Overflow, Vertical-Align Bottom...how do I do this?
am 03.07.2007 09:30:11 von Ben C
On 2007-07-03, BeeRich wrote:
> Hi folks.
>
> Question for the gurus.
>
> I have a box 200 wide, 200 tall. I insert text in there and it's
> larger than the box. So I set overflow to hidden. The result is
> text
> that starts at the beginning, and the end of the paragraph is sliced
> off at the end.
>
> How do I shove this vertically, so that the beginning is cut off, and
> the last parts of that text are shown, aligned to the bottom? The
> length of this text will change, so I need a way of aligning it so
> that the top part becomes hidden, not the bottom.
Use absolute positioning to put one box inside another and to align the
inner box with the bottom of the outer one. If you leave top and height
auto on the inner one, it will get its content height and overflow its
container upwards.
...
1 blah
2 blah
3 blah
4 blah
5 blah
Re: Clip Overflow, Vertical-Align Bottom...how do I do this?
am 03.07.2007 09:33:28 von Ben C
On 2007-07-03, Neredbojias wrote:
> On Tue, 03 Jul 2007 05:29:23 GMT BeeRich scribed:
>
>> Hi folks.
>>
>> Question for the gurus.
>>
>> I have a box 200 wide, 200 tall. I insert text in there and it's
>> larger than the box. So I set overflow to hidden. The result is
>> text
>> that starts at the beginning, and the end of the paragraph is sliced
>> off at the end.
>>
>> How do I shove this vertically, so that the beginning is cut off, and
>> the last parts of that text are shown, aligned to the bottom? The
>> length of this text will change, so I need a way of aligning it so
>> that the top part becomes hidden, not the bottom.
>>
>> Any ideas?
>
> There are ways to reverse text direction (rtl or ltr) but I don't know for
> sure if they can be applied to a single element.
They can be.
> Furthermore, the lines
> would probably still go from top to bottom, but I'd experiment to see what
> I could come up with.
The lines still go from top to bottom. They always go from top to bottom
in CSS. I don't know of any language in which lines might be written
bottom to top, although perhaps there are some. You can write characters
top to bottom and lines right-to-left in Chinese or Japanese (in books,
not CSS) but I've never heard of anything going bottom-to-top.
OP could always turn his monitor upside down I suppose.
Re: Clip Overflow, Vertical-Align Bottom...how do I do this?
am 03.07.2007 10:07:24 von BeeRich
On Jul 3, 3:30 am, Ben C wrote:
> On 2007-07-03, BeeRich wrote:
>
> > Hi folks.
>
> > Question for the gurus.
>
> > I have a box 200 wide, 200 tall. I insert text in there and it's
> > larger than the box. So I set overflow to hidden. The result is
> > text
> > that starts at the beginning, and the end of the paragraph is sliced
> > off at the end.
>
> > How do I shove this vertically, so that the beginning is cut off, and
> > the last parts of that text are shown, aligned to the bottom? The
> > length of this text will change, so I need a way of aligning it so
> > that the top part becomes hidden, not the bottom.
>
> Use absolute positioning to put one box inside another and to align the
> inner box with the bottom of the outer one. If you leave top and height
> auto on the inner one, it will get its content height and overflow its
> container upwards.
>
>
>
> ...
>
>
>
> 1 blah
> 2 blah
> 3 blah
> 4 blah
> 5 blah
>
>
Ah it worked. Now to apply it to my real application.
Cheers
Re: Clip Overflow, Vertical-Align Bottom...how do I do this?
am 03.07.2007 10:08:20 von BeeRich
On Jul 3, 3:33 am, Ben C wrote:
> On 2007-07-03, Neredbojias wrote:
>
>
>
> > On Tue, 03 Jul 2007 05:29:23 GMT BeeRich scribed:
>
> >> Hi folks.
>
> >> Question for the gurus.
>
> >> I have a box 200 wide, 200 tall. I insert text in there and it's
> >> larger than the box. So I set overflow to hidden. The result is
> >> text
> >> that starts at the beginning, and the end of the paragraph is sliced
> >> off at the end.
>
> >> How do I shove this vertically, so that the beginning is cut off, and
> >> the last parts of that text are shown, aligned to the bottom? The
> >> length of this text will change, so I need a way of aligning it so
> >> that the top part becomes hidden, not the bottom.
>
> >> Any ideas?
>
> > There are ways to reverse text direction (rtl or ltr) but I don't know for
> > sure if they can be applied to a single element.
>
> They can be.
>
> > Furthermore, the lines
> > would probably still go from top to bottom, but I'd experiment to see what
> > I could come up with.
>
> The lines still go from top to bottom. They always go from top to bottom
> in CSS. I don't know of any language in which lines might be written
> bottom to top, although perhaps there are some. You can write characters
> top to bottom and lines right-to-left in Chinese or Japanese (in books,
> not CSS) but I've never heard of anything going bottom-to-top.
>
> OP could always turn his monitor upside down I suppose.
You missed what I'm saying. Alignment of the block of text on the
bottom, so the top overflow is hidden.
Re: Clip Overflow, Vertical-Align Bottom...how do I do this?
am 03.07.2007 10:50:50 von BeeRich
OK, tried inserting the very exact syntax into my css file, and she
isn't working. I have a div on top of that, a div below, and she's
aligning from the beginning of the text and clipping the bottom.
This makes no sense. I'm doing this in FF and Safari. Neither wants
to play.
Re: Clip Overflow, Vertical-Align Bottom...how do I do this?
am 03.07.2007 11:51:56 von Ben C
On 2007-07-03, BeeRich wrote:
> OK, tried inserting the very exact syntax into my css file, and she
> isn't working. I have a div on top of that, a div below, and she's
> aligning from the beginning of the text and clipping the bottom.
>
> This makes no sense. I'm doing this in FF and Safari. Neither wants
> to play.
You need to post a URL.
Or, find the problem yourself. Use Firebug to verify that elements are
getting the computed styles you think they should be getting.
You also have to make sure you've got the containing block right.
Remember a positioned block's containing block is its nearest positioned
ancestor. Use position: relative to make a normal flow block the
containing block for positioned descendents.
Re: Clip Overflow, Vertical-Align Bottom...how do I do this?
am 03.07.2007 13:02:45 von BeeRich
On Jul 3, 5:51 am, Ben C wrote:
>
> You need to post a URL.
>
> Or, find the problem yourself. Use Firebug to verify that elements are
> getting the computed styles you think they should be getting.
>
> You also have to make sure you've got the containing block right.
> Remember a positioned block's containing block is its nearest positioned
> ancestor. Use position: relative to make a normal flow block the
> containing block for positioned descendents.
I fixed it. I entered the new text div and was targetting the
container. So she works now.
Cheers