473,503 Members | 1,797 Online
Bytes | Software Development & Data Engineering Community
+ Post

Home Posts Topics Members FAQ

resizing DIV

Hello

I've created a style for a div that is set to a specific height. My
question is that if the content in this div is larger will it resize to fit
the new content?

Thank you
Kona
Jul 20 '05 #1
4 15757
In post <V4***********************@news1.calgary.shaw.ca >
Kona said...

I've created a style for a div that is set to a specific height. My
question is that if the content in this div is larger will it resize to fit
the new content?


what happened when you tried it?

--
brucie a. blackford. 30/July/2003 12:02:54 am kilo.
http://loser.brucies.com/
Jul 20 '05 #2
I'm in the planning stage laying out what I want to achieve on paper so I
haven't gotten to the coding yet. The div will contain a different picture
each week and the sizes maybe different.

Good suggestion I test it out first.

Cheers Kona
"brucie" <br******@loser.brucies.com> wrote in message
news:d2**************@alt-html.org...
In post <V4***********************@news1.calgary.shaw.ca >
Kona said...

I've created a style for a div that is set to a specific height. My
question is that if the content in this div is larger will it resize to fit the new content?


what happened when you tried it?

--
brucie a. blackford. 30/July/2003 12:02:54 am kilo.
http://loser.brucies.com/

Jul 20 '05 #3
Kona wrote:
I've created a style for a div that is set to a specific height. My
question is that if the content in this div is larger will it resize to
fit the new content?


The CSS 2 recommendation doesn't say:

"10.6.3 Block-level, non-replaced elements in normal flow, and floating,
non-replaced elements

If 'top', 'bottom', 'margin-top', or 'margin-bottom' are 'auto', their
computed value is 0. If 'height' is 'auto', the height depends on whether
the element has any block-level children. If it only has inline-level
children, the height is from the top of the topmost line box to the bottom
of the bottommost line box. If it has block-level children, it is the
distance from the top border-edge of the topmost block-level child box, to
the bottom border-edge of the bottommost block-level child box. Only
children in the normal flow are taken into account (i.e., floating boxes
and absolutely positioned boxes are ignored, and relatively positioned
boxes are considered without their offset). Note that the child box may be
an anonymous box."

-- <URL:http://www.w3.org/TR/REC-CSS2/visudet.html#q17>

I think that the implication is that if the height property is set, the
height of the element is whatever you have set it to (hey, it makes sense
:) ). So then we need to look at the overflow property definition:

<URL:http://www.w3.org/TR/REC-CSS2/visufx.html#propdef-overflow>

The initial value of the overflow property is 'visible', which means that if
the content of the element is overflowing, it should "spill out" of the
element.

Of course, this doesn't address the option of user-agent stylesheets, but
none of the values available for the overflow property allow for expanding
an element's height in this way.

In practice, I have observed Internet Explorer, Mozilla, and Opera to expand
the height of an element to accommodate its contents. Konqueror, on the
other hand, overflows properly.

It would seem to me that you are actually looking for the 'min-height'
property, and it would be unwise to depend on this out-of-spec behaviour to
continue to work. Internet Explorer doesn't support this property though.
One workaround is to specify the height and min-height to the same length,
and then override the height property back to 'auto' with one of the many
techniques that hides a CSS rule from Internet Explorer. The drawback to
this workaround is that Konqueror doesn't understand the 'auto' keyword for
the height element [1], and so it will not render the way you want it to in
this browser.

[1] This has been fixed in HEAD, but I don't think this bugfix will make it
out to a public release until KDE 3.2.

--
Jim Dabell

Jul 20 '05 #4
Thank you for the detailed answer you have been very helpful.

Cheers
Kona
"Jim Dabell" <ji********@jimdabell.com> wrote in message
news:1Y********************@giganews.com...
Kona wrote:
I've created a style for a div that is set to a specific height. My
question is that if the content in this div is larger will it resize to
fit the new content?
The CSS 2 recommendation doesn't say:

"10.6.3 Block-level, non-replaced elements in normal flow, and floating,
non-replaced elements

If 'top', 'bottom', 'margin-top', or 'margin-bottom' are 'auto', their
computed value is 0. If 'height' is 'auto', the height depends on whether
the element has any block-level children. If it only has inline-level
children, the height is from the top of the topmost line box to the bottom
of the bottommost line box. If it has block-level children, it is the
distance from the top border-edge of the topmost block-level child box, to
the bottom border-edge of the bottommost block-level child box. Only
children in the normal flow are taken into account (i.e., floating boxes
and absolutely positioned boxes are ignored, and relatively positioned
boxes are considered without their offset). Note that the child box may be
an anonymous box."

-- <URL:http://www.w3.org/TR/REC-CSS2/visudet.html#q17>

I think that the implication is that if the height property is set, the
height of the element is whatever you have set it to (hey, it makes sense
:) ). So then we need to look at the overflow property definition:

<URL:http://www.w3.org/TR/REC-CSS2/visufx.html#propdef-overflow>

The initial value of the overflow property is 'visible', which means that

if the content of the element is overflowing, it should "spill out" of the
element.

Of course, this doesn't address the option of user-agent stylesheets, but
none of the values available for the overflow property allow for expanding
an element's height in this way.

In practice, I have observed Internet Explorer, Mozilla, and Opera to expand the height of an element to accommodate its contents. Konqueror, on the
other hand, overflows properly.

It would seem to me that you are actually looking for the 'min-height'
property, and it would be unwise to depend on this out-of-spec behaviour to continue to work. Internet Explorer doesn't support this property though.
One workaround is to specify the height and min-height to the same length,
and then override the height property back to 'auto' with one of the many
techniques that hides a CSS rule from Internet Explorer. The drawback to
this workaround is that Konqueror doesn't understand the 'auto' keyword for the height element [1], and so it will not render the way you want it to in this browser.

[1] This has been fixed in HEAD, but I don't think this bugfix will make it out to a public release until KDE 3.2.

--
Jim Dabell

Jul 20 '05 #5

This thread has been closed and replies have been disabled. Please start a new discussion.

Similar topics

10
2288
by: riki | last post by:
Hi, i have a big problem...i'm using one jscript for resizing of all of my pics in popUp...in main html i'm having many little pics and clicking on them they open in popUp and resize to larger...
0
2616
by: TJ Talluto | last post by:
<facts> I have a "month calendar" that always displays exactly 42 days... and alongside is a vertical box that displays the detail (form fields) of any particular select event that appears on the...
5
4719
by: Jim | last post by:
I've heard that resizing images through PHP (either GD2 or ImageMagick) is a processor intensive exercise. I'm setting up a site where users will be uploading up to 10 images along with the details...
1
5199
by: Terry | last post by:
I've seen several posts from people who have seen this flashing in TreeView's when resizing a form. I've noticed it in my app, but only in the child windows. For example, my main form has a...
12
6693
by: Søren Reinke | last post by:
Hi there I have a little problem. How do i make sure that a graph is not redrawn while the form with the graph is being resized ? I have tried to add a mouse up/down event handler on the...
11
17804
by: Sharon | last post by:
I'm writing a new control derived from UserControl. I need to get an event when the control is done resizing. I tried the Resize, SizeChanged, Move and the Layout events and I also tried to...
6
2252
by: tomasio | last post by:
Dear NG, years have passed and I am still more designer than programmer. I build a new version of my website which has a few nasty bugs, especially on my startpage: Resizing text brakes the...
6
4523
by: JDeats | last post by:
I have a WinForms based application written for the .NET Framework 2.0 and in this application I need to be able to be able to take some action in code when the user finishes resizing the form. ...
9
5267
by: dli07 | last post by:
Hello, I'm trying to convert a piece of code that creates a dynamic vertical resizing bar in a table from internet explorer to firefox. It's based on a post from...
10
7038
by: mishrarajesh44 | last post by:
hii all, I am facing a problem currently.. i have a script for image uploading and resizing.. the image uploading takes place properly for every size images.. but, the resizing works for...
0
7076
by: Hystou | last post by:
Most computers default to English, but sometimes we require a different language, especially when relocating. Forgot to request a specific language before your computer shipped? No problem! You can...
0
7274
Oralloy
by: Oralloy | last post by:
Hello folks, I am unable to find appropriate documentation on the type promotion of bit-fields when using the generalised comparison operator "<=>". The problem is that using the GNU compilers,...
0
7323
jinu1996
by: jinu1996 | last post by:
In today's digital age, having a compelling online presence is paramount for businesses aiming to thrive in a competitive landscape. At the heart of this digital strategy lies an intricately woven...
1
6984
by: Hystou | last post by:
Overview: Windows 11 and 10 have less user interface control over operating system update behaviour than previous versions of Windows. In Windows 11 and 10, there is no way to turn off the Windows...
0
7453
tracyyun
by: tracyyun | last post by:
Dear forum friends, With the development of smart home technology, a variety of wireless communication protocols have appeared on the market, such as Zigbee, Z-Wave, Wi-Fi, Bluetooth, etc. Each...
0
4670
by: conductexam | last post by:
I have .net C# application in which I am extracting data from word file and save it in database particularly. To store word all data as it is I am converting the whole word file firstly in HTML and...
0
3151
by: adsilva | last post by:
A Windows Forms form does not have the event Unload, like VB6. What one acts like?
0
1507
by: 6302768590 | last post by:
Hai team i want code for transfer the data from one system to another through IP address by using C# our system has to for every 5mins then we have to update the data what the data is updated ...
1
732
muto222
by: muto222 | last post by:
How can i add a mobile payment intergratation into php mysql website.

By using Bytes.com and it's services, you agree to our Privacy Policy and Terms of Use.

To disable or enable advertisements and analytics tracking please visit the manage ads & tracking page.