FreewayTalk

11 replies to this thread. Most Recent

Todd

13 Nov 2007, 6:13 pm

Overriding Inline CSS

Some elements have margin and size issues in IE 6 and 5.5 that I believe I could easily fix in their conditional stylesheets but because this info is placed inline by FW how can I override it? Inline CSS does trump external sheets, correct?

Todd

waltd

13 Nov 2007, 6:18 pm

Yes. The only way to do this would be with an Action. Luckily enough, I have done some of this work in the Protaculous Action Bundle (specifically in the Carousel Action). If you want to venture into Action-writing, I could give you some pointers on where to look in there and what you need to do. Paul Dunning also had a much more evolved system that cleaned out all of the internal styles, but I don’t think that was ever revised for FW4. I stand ready to be corrected on that point.

Walter

On Nov 13, 2007, at 2:13 PM, Todd wrote:

Some elements have margin and size issues in IE 6 and 5.5 that I believe I could easily fix in their conditional stylesheets but because this info is placed inline by FW how can I override it? Inline CSS does trump external sheets, correct?

Todd

Freeway user since 1997

http://www.walterdavisstudio.com

Todd

13 Nov 2007, 6:24 pm

Well, I guess it was bound to happen eventually (action-writing) so if you don’t mind I’m willing to give it a shot.

Thanks,

Todd

On Nov 13, 2007, at 1:18 PM, Walter Lee Davis wrote:

Yes. The only way to do this would be with an Action. Luckily enough, I have done some of this work in the Protaculous Action Bundle (specifically in the Carousel Action). If you want to venture into Action-writing, I could give you some pointers on where to look in there and what you need to do.

b8

13 Nov 2007, 6:56 pm

On 13 Nov. 2007, 6:13 pm, Todd wrote:

Some elements have margin and size issues in IE 6 and 5.5 that I believe I could easily fix in their conditional stylesheets but because this info is placed inline by FW how can I override it? Inline CSS does trump external sheets, correct?

Todd

Could the Remove Div Style action help you with this? Remove the inline style and place the prefered styles in the FW stylesheet an the conditional stylesheet. I’am using this action to remove the inline styles in FW.

Todd

13 Nov 2007, 7:02 pm

Hi b8,

Now that sounds like just the thing. Is that a Weaver action? I don’t seem to have it but I’ll find it.

Many thanks,

Todd

On Nov 13, 2007, at 1:56 PM, b8 wrote:

Could the Remove Div Style action help you with this? Remove the inline style and place the prefered styles in the FW stylesheet an the conditional stylesheet.

waltd

13 Nov 2007, 7:05 pm

Download the latest Protaculous from here:

http://freewaypro.com/actions/downloads

Unzip it, and then use the right-click or Control-click contextual menu in the Finder to “Show Package Contents”. Navigate to the Resources folder, and you will find protaculous.fwaction.

The relevant parts are around line 286 and line 318. Basically, what you will want to do is get a reference to the selected item, which is what happens in line 287, then create a new style for it in the head tag, which is what line 318 does.

Off the top of my head, this would probably do what you want, assuming that you selected a DIV and applied the action to it:

var thisItem = fwDocument.fwTags.fwFind("div", fwItem);
if (thisItem && thisItem.id){
    var myHead = fwDocument.fwTags.fwFind('head');
    if (myHead)
        var cssStyles = myHead.fwAddCSSStyles();
        cssStyles.fwAddRawln("#" + thisItem.id + " { " + wrapper.style.toString().slice(1,-1) + " }");
    }
}

You’ll need to wrap this up in an item-action, the easiest way to do that would be to copy the Carousel action, delete all of the action-file references and the interface controls and the action-include, and just leave yourself with an empty function fwAfterEndBody(). Put all of your code inside that.

Let me know how you get on with it.

Walter

Freeway user since 1997

http://www.walterdavisstudio.com

b8

13 Nov 2007, 7:09 pm

Hi Todd,

I don’t know anymore the author, maybe Paul Dunning? I’ll send you the action.

Op 13-nov-2007, om 21:02 heeft Todd het volgende geschreven:

Hi b8,

Now that sounds like just the thing. Is that a Weaver action? I don’t seem to have it but I’ll find it.

Many thanks,

Todd

On Nov 13, 2007, at 1:56 PM, b8 wrote:

Could the Remove Div Style action help you with this? Remove the inline style and place the prefered styles in the FW stylesheet an the conditional stylesheet.

waltd

13 Nov 2007, 7:10 pm

On 13 Nov. 2007, 7:02 pm, Todd wrote:

Hi b8,

Now that sounds like just the thing. Is that a Weaver action? I don’t seem to have it but I’ll find it.

Many thanks,

Todd

That is a Weaver thing, but I don’t think that it replaces the style it removes back in the page head. For that, please do investigate the code I just posted. It should allow you to put the code exactly where you want it. If you read some more in the full action, there is some code that will show you how to surgically remove individual styles within an Action, or to modify them in place. It should be possible to do anything you want if you write the thing yourself.

Walter

Freeway user since 1997

http://www.walterdavisstudio.com

Todd

13 Nov 2007, 8:14 pm

Thanks Walter, I’ll take a run at it.

Todd

On Nov 13, 2007, at 2:05 PM, waltd wrote:

You’ll need to wrap this up in an item-action, the easiest way to do that would be to copy the Carousel action, delete all of the action-file references and the interface controls and the action- include, and just leave yourself with an empty function fwAfterEndBody(). Put all of your code inside that.

Let me know how you get on with it.

waltd

14 Nov 2007, 2:20 am

On 13 Nov. 2007, 7:05 pm, waltd wrote:

      cssStyles.fwAddRawln("#" + thisItem.id + " { " + wrapper.style.toString().slice(1,-1) + " }");

Just spotted a mistake here. make this line

        cssStyles.fwAddRawln("#" + thisItem.id + " { " + thisItem.style.toString().slice(1,-1) + " }");

Walter

Freeway user since 1997

http://www.walterdavisstudio.com

The Big Erns

14 Nov 2007, 7:36 pm

Yes, Remove DIV Style is a Weaver action. It does zactly what I need and I use it all ze time ;-)

Todd wrote:

Now that sounds like just the thing. Is that a Weaver action? I don’t seem to have it but I’ll find it.

Ernie Simpson — Freeway 4 Pro User — http://www.thebigerns.com/freeway/

no longer subscribed to this discussion…

Back to Top

Todd

14 Nov 2007, 7:59 pm

I’m lovin’ this action, no div is safe. I’m working on a very small site and decided to apply it to every single div I can just to get a feel for the amount of work required to add the CSS back in manually and it’s not that bad. I suppose if you’re not used to having to worry about such things it would be a pain but the code looks so much nicer, though I’m not sure I would do it for every site.

I sure wish FW was able to do this out of the box.

Todd

On Nov 14, 2007, at 2:36 PM, Ernie Simpson wrote:

Yes, Remove DIV Style is a Weaver action. It does zactly what I need and I use it all ze time ;-)