Min-Height

How do you get this IE hack into Freeway styles?

http://www.dustindiaz.com/min-height-fast-hack/


freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options

There’s definitely a way to code this as an item action, and there
might be a way to create a page action, but I’m not sure how you
would qualify which elements to treat this way.

But if you want to add this to your design right now, you would want
to click on the element, note its height in the Inspector, and then
select Item / Extended from the main menu. Choose the DIV Style
segment, and click on new. Add the height:auto !important by adding
the values like this (without the single-quotes):

Name: ‘min-height’

Value: ‘500px’ (or whatever you found to be the height)

Now, to add the height values in, you have to do something tricky.
This is because Freeway will remove its own value for height if you
add a height attribute using the Extended dialog. So you have to
create a “double” selector like this:

Name: ‘height’

Value: ‘auto !important; height:500px’

No, that’s not a mistake! You actually have to write the semicolon
and another instance of ‘height’ within the Value field of the dialog.

Caveat: this will work in Freeway 5, might not work correctly in
various flavors of Freeway 4 – there were some bugs around the
“remove the height if it’s added in Extended” behavior in various
versions of 4. What I am describing here is the actual preferred
design behavior for the app.

Walter

On Jun 3, 2008, at 11:51 AM, WebWorker wrote:

How do you get this IE hack into Freeway styles?

http://www.dustindiaz.com/min-height-fast-hack/


freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options


freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options

Create a Tag-only style named selector and add each of the attributes via the Extended window.

Todd

On Jun 3, 2008, at 10:51 AM, WebWorker wrote:

How do you get this IE hack into Freeway styles?

Styles in the HEAD won’t override the inline styles on the object.
That’s why you have to go to the lengths I did.

Walter

On Jun 3, 2008, at 12:15 PM, Todd wrote:

Create a Tag-only style named selector and add each of the
attributes via the Extended window.

Todd

On Jun 3, 2008, at 10:51 AM, WebWorker wrote:

How do you get this IE hack into Freeway styles?


freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options


freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options

Yes, of course. Well, I’ll be shutting up now.

Todd

On Jun 3, 2008, at 11:21 AM, Walter Lee Davis wrote:

Styles in the HEAD won’t override the inline styles on the object.

That’s why you have to go to the lengths I did.

Thanks I’ll give it a go.

I’ve used previous to this a “prop” (a gif or 1px wide div floated right) to hold the height of a div to create a min height, so hopefully this might be a neater solution. After testing.


freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options

Perfect.

Works on an IE6 box here

Thanks again Walter.


freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options

On a vaguely similar thread, or at least the same job I’m working on.

I have a div, when not populated with some php variables, shrinks to zero depth and is not visible on the page. OK on Mac an IE7, but IE6, this shows the div, and background colour as 1px deep.

Can IE6 show div cope with divs of zero height?


freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options

Check to make sure that this div is really empty. How are you filling
it with content? If you have simply inserted a Markup Item in the
div, then you may find that it is wrapped in a P tag, and that P tag
may have the default “empty div” freeway style on it that makes it
1px tall.

Try either my CrowBar Action or Tim Plumb’s Remove Paragraph Action,
depending on whether you have any other content in the DIV that might
actually need to be wrapped in a P. Apply Remove Paragraph to the div
and enable it. Any Freeway-generated paragraph tags will be removed.
Insert CrowBar as an inline Action in place of your Markup Item, and
use the Action palette to enter your code. Either of these will keep
the Freeway paragraphs from appearing in the output.

If that’s not the solution, then you might be hitting a browser bug
with your empty DIV. Try modifying your PHP variable to emit a single
empty HTML comment instead of nothing.

print (!empty($variable)) ? $variable : '<!--  -->';

Walter

On Jun 3, 2008, at 1:09 PM, WebWorker wrote:

On a vaguely similar thread, or at least the same job I’m working on.

I have a div, when not populated with some php variables, shrinks
to zero depth and is not visible on the page. OK on Mac an IE7, but
IE6, this shows the div, and background colour as 1px deep.

Can IE6 show div cope with divs of zero height?


freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options


freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options

The div has just got a HTML markup containing PHP - which only expands down when someone logs in, and contains either 3 lines on text, or nothing shrinking to 0px (apart from IE6 that is, when its 1px)

Heres the code with nothing in I assume its the

that is causing it?

</div>
<div id="dropdown" class="keywords f-x2" style="position:absolute; left:207px; top:0px; width:553px; z-index:10; padding-left:10px; padding-right:10px; background-color:#ff0; overflow:visible">
	<p class="f-lp"></p>
</div>

freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options

That P is your culprit here. Look at your page HEAD, and you’ll see that the class .f-lp has a height of 1px. Most browsers auto-collapse an empty P to nothing, but apparently IE is following the style.

I would use the Remove Paragraph Action, found at all good Action retailers.

(Kidding. I mean here: http://freewayactions.com )

Walter


freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options

It seems that The Remove Paragraph, or Crowbar action makes things worse making the box deeper - when the

are taken out in IE6/7

But what does seem to make a difference is just to make the top margin -2px to tuck the box up under the top of the browser window so it does not not show (Its a hidden drop down)


freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options

Odd. Can you post a link to the broken page so I can take a look at it?

Thanks,

Walter


freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options

Here is a test page:

http://www.realshetland.com/setup/dropdown.php

With two divs with no content (You need netrenderer IE6 to see them)

One as is, one with the P tag removed, either way IE6 does not collapse the div to 0px. (Marked up with your comment action)

Best workaround I can see is to put -2px top margin and tuck under the top of the browser window.


freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options

I’m going to take a guess here that this is related to the whitespace problem in IE6. Your div is empty, but it has a couple of newline characters in it. IE has a problem in UL tags where any white space in the code between the LIs will become visible space in the layout. You have to run the tags all together on one line to get rid of the problem.

One quick way to test this assertion is to change your code to More Efficient, which jams everything together on as few lines as possible. If you are using my Action, this might not be enough to fix the problem, I can’t recall if I set it to remove newlines or not when this preference is toggled.

Walter


freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options

Hi all,

I have used ‘min-height’ with success on 3 html boxes which line up horizontally on the page.
Each have varying quantities of text in them. When previewing the page, if I increase the font sizes the bottoms of the boxes no longer line up and it looks a little messy.

Is there a way of ensuring the boxes grow together?

Thanks


freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options

If you specify the min-height in ems your boxes will grow proportionally (within reason). You’ll have to fiddle with the values, and also set the line-spacing in ems. Freeway Pro lets you enter em as the unit for many properties, you just have to type it in the box directly after the numeric value to override the default px unit.

Walter


freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options