Re: OT: CSS Question
Yes. link href=styles.css type=text/css rel=stylesheet media=*all* / link href=print.css type=text/css rel=stylesheet media=*print* / ~| Adobe® ColdFusion® 8 software 8 is the most important and dramatic release to date Get the Free Trial http://ad.doubleclick.net/clk;160198600;22374440;w Archive: http://www.houseoffusion.com/groups/CF-Talk/message.cfm/messageid:299458 Subscription: http://www.houseoffusion.com/groups/CF-Talk/subscribe.cfm Unsubscribe: http://www.houseoffusion.com/cf_lists/unsubscribe.cfm?user=11502.10531.4
Re: OT: CSS Question
Heh. The asterisks were placed in by Gmail's editor, to signify bold. I was merely attempting to highlight the key words. After I sent my reply, I found that other people had already answered the question. For some reason the thread didn't stay together in my Gmail account, so I thought I was answering an unanswered question. Unfortunately I didn't reach out quickly enough to pull the email back in. (I'm gonna need to work on my reach.) ~| Adobe® ColdFusion® 8 software 8 is the most important and dramatic release to date Get the Free Trial http://ad.doubleclick.net/clk;160198600;22374440;w Archive: http://www.houseoffusion.com/groups/CF-Talk/message.cfm/messageid:299468 Subscription: http://www.houseoffusion.com/groups/CF-Talk/subscribe.cfm Unsubscribe: http://www.houseoffusion.com/cf_lists/unsubscribe.cfm?user=11502.10531.4
RE: OT: CSS Question
Matt, why the asterisks beside all and print, as in *all* and *print*? How is that different from media=all and media=print? Haven't used the various media designations before, so I'm curious. Rick -Original Message- From: Matt Quackenbush [mailto:[EMAIL PROTECTED] Sent: Wednesday, February 20, 2008 1:12 PM To: CF-Talk Subject: Re: OT: CSS Question Yes. link href=styles.css type=text/css rel=stylesheet media=*all* / link href=print.css type=text/css rel=stylesheet media=*print* / ~| Adobe® ColdFusion® 8 software 8 is the most important and dramatic release to date Get the Free Trial http://ad.doubleclick.net/clk;160198600;22374440;w Archive: http://www.houseoffusion.com/groups/CF-Talk/message.cfm/messageid:299460 Subscription: http://www.houseoffusion.com/groups/CF-Talk/subscribe.cfm Unsubscribe: http://www.houseoffusion.com/cf_lists/unsubscribe.cfm?user=89.70.4
OT: CSS Question
I understand how to make fields invisible, but is there a way to have a field display on the screen, but become invisible when printed? For example, can I set one stylesheet for Display and another for printing? Andy ~| Adobe® ColdFusion® 8 software 8 is the most important and dramatic release to date Get the Free Trial http://ad.doubleclick.net/clk;160198600;22374440;w Archive: http://www.houseoffusion.com/groups/CF-Talk/message.cfm/messageid:299366 Subscription: http://www.houseoffusion.com/groups/CF-Talk/subscribe.cfm Unsubscribe: http://www.houseoffusion.com/cf_lists/unsubscribe.cfm?user=11502.10531.4
OT css/flash question.
I'm using a template from freetemplates.com. The css file seems quite well done. I want to replace an image with a small flash movie. I thought I would just eliminate the image, and embed the movie in the html page. However, when I just put the movie on the page, as is or in between two div tags, it will display, but nothing on the page below it will. Here is the code from the page with the swf: !DOCTYPE html PUBLIC -//W3C//DTD XHTML 1.1//EN http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd; html head meta http-equiv=content-type content=text/html; charset=iso-8859-1/ meta name=description content=description/ meta name=keywords content=keywords/ meta name=author content=author/ link rel=stylesheet type=text/css href=default.css/ titlePyramid Home Works/title /head body div class=main div class=gfxh1Pyramid Homeworks/h1/div object classid=clsid:d27cdb6e-ae6d-11cf-96b8-44455354 codebase=http://fpdownload.macromedia.com/pub/shockwave/cabs/flash/swflash. cab#version=8,0,0,0 width=766 height=250 id=pyramidHeader6 align=middle param name=allowScriptAccess value=sameDomain / param name=movie value=pyramidHeader6.swf /param name=quality value=high /param name=bgcolor value=#141a27 /embed src=pyramidHeader6.swf quality=high bgcolor=#141a27 width=766 height=250 name=pyramidHeader6 align=middle allowScriptAccess=sameDomain type=application/x-shockwave-flash pluginspage=http://www.macromedia.com/go/getflashplayer; / div class=menu a href=index.htmlspanHome/span/a a href=index.htmlspanAbout Us/span/a a href=index.htmlspanGallery/span/a a href=index.htmlspanContact Us/span/a a href=login/LoginForm.cfm id=lastspanCustomer Log In/span/a /div div class=content div class=item ..page content continues. It doesn't seem to matter whether the flash object is wrapped in div tags or not, everything below the movies goes away. If I could grow a brain real fast, what I'd really like to do is replace the image in the div class =gfx referenced on this page to the css template. The class on the css template looks like so: /* Header */ ..gfx { background: #222 url(img/dark_pixel.jpg) no-repeat; height: 240px; But, one way or the other, what I'd really like to do is get the swf to show along with the other content below it. Thanks, Mark ~| Adobe® ColdFusion® 8 software 8 is the most important and dramatic release to date Get the Free Trial http://ad.doubleclick.net/clk;160198600;22374440;w Archive: http://www.houseoffusion.com/groups/CF-Talk/message.cfm/messageid:296732 Subscription: http://www.houseoffusion.com/groups/CF-Talk/subscribe.cfm Unsubscribe: http://www.houseoffusion.com/cf_lists/unsubscribe.cfm?user=89.70.4
Re: OT css/flash question.
Offhand, it looks like you aren't closing your object block. --Ben Doom Mark Fuqua wrote: I'm using a template from freetemplates.com. The css file seems quite well done. I want to replace an image with a small flash movie. I thought I would just eliminate the image, and embed the movie in the html page. However, when I just put the movie on the page, as is or in between two div tags, it will display, but nothing on the page below it will. Here is the code from the page with the swf: !DOCTYPE html PUBLIC -//W3C//DTD XHTML 1.1//EN http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd; html head meta http-equiv=content-type content=text/html; charset=iso-8859-1/ meta name=description content=description/ meta name=keywords content=keywords/ meta name=author content=author/ link rel=stylesheet type=text/css href=default.css/ titlePyramid Home Works/title /head body div class=main div class=gfxh1Pyramid Homeworks/h1/div object classid=clsid:d27cdb6e-ae6d-11cf-96b8-44455354 codebase=http://fpdownload.macromedia.com/pub/shockwave/cabs/flash/swflash. cab#version=8,0,0,0 width=766 height=250 id=pyramidHeader6 align=middle param name=allowScriptAccess value=sameDomain / param name=movie value=pyramidHeader6.swf /param name=quality value=high /param name=bgcolor value=#141a27 /embed src=pyramidHeader6.swf quality=high bgcolor=#141a27 width=766 height=250 name=pyramidHeader6 align=middle allowScriptAccess=sameDomain type=application/x-shockwave-flash pluginspage=http://www.macromedia.com/go/getflashplayer; / div class=menu a href=index.htmlspanHome/span/a a href=index.htmlspanAbout Us/span/a a href=index.htmlspanGallery/span/a a href=index.htmlspanContact Us/span/a a href=login/LoginForm.cfm id=lastspanCustomer Log In/span/a /div div class=content div class=item ..page content continues. It doesn't seem to matter whether the flash object is wrapped in div tags or not, everything below the movies goes away. If I could grow a brain real fast, what I'd really like to do is replace the image in the div class =gfx referenced on this page to the css template. The class on the css template looks like so: /* Header */ ..gfx { background: #222 url(img/dark_pixel.jpg) no-repeat; height: 240px; But, one way or the other, what I'd really like to do is get the swf to show along with the other content below it. Thanks, Mark ~| Adobe® ColdFusion® 8 software 8 is the most important and dramatic release to date Get the Free Trial http://ad.doubleclick.net/clk;160198600;22374440;w Archive: http://www.houseoffusion.com/groups/CF-Talk/message.cfm/messageid:296746 Subscription: http://www.houseoffusion.com/groups/CF-Talk/subscribe.cfm Unsubscribe: http://www.houseoffusion.com/cf_lists/unsubscribe.cfm?user=11502.10531.4
Re: OT css/flash question.
On Thursday 17 Jan 2008, Mark Fuqua wrote: I'm using a template from freetemplates.com. The css file seems quite well done. I want to replace an image with a small flash movie. Give SWFObject a go. -- Tom Chiverton Helping to synergistically conquer front-end synergies on: http://thefalken.livejournal.com This email is sent for and on behalf of Halliwells LLP. Halliwells LLP is a limited liability partnership registered in England and Wales under registered number OC307980 whose registered office address is at Halliwells LLP, 3 Hardman Square, Spinningfields, Manchester, M3 3EB. A list of members is available for inspection at the registered office. Any reference to a partner in relation to Halliwells LLP means a member of Halliwells LLP. Regulated by The Solicitors Regulation Authority. CONFIDENTIALITY This email is intended only for the use of the addressee named above and may be confidential or legally privileged. If you are not the addressee you must not read it and must not use any information contained in nor copy it nor inform any person other than Halliwells LLP or the addressee of its existence or contents. If you have received this email in error please delete it and notify Halliwells LLP IT Department on 0870 365 2500. For more information about Halliwells LLP visit www.halliwells.com. ~| Adobe® ColdFusion® 8 software 8 is the most important and dramatic release to date Get the Free Trial http://ad.doubleclick.net/clk;160198600;22374440;w Archive: http://www.houseoffusion.com/groups/CF-Talk/message.cfm/messageid:296736 Subscription: http://www.houseoffusion.com/groups/CF-Talk/subscribe.cfm Unsubscribe: http://www.houseoffusion.com/cf_lists/unsubscribe.cfm?user=11502.10531.4
OT: CSS menu looks great on its own - looks jacked up on site
This isn't really cf-related, but I was hired to build a dropdown menu for an e-comm site. The menu looks/work fantastic on its own page, but is really screwed on their staging server. Now, their code is incredibly sloppy. There's not even a doctype. I still figured I could make it look right nonetheless. Here it is on MY server (Beautiful): http://capublish.com/menutest.cfm Here's on the staging server (Way jacked up): http://audition.commercev3.com/ Don't anybody spend much time. I just thought somebody could steer me in the right direction since I've banged my head against the wall too long on this. I'm wonderin if it's just the fact that the code is so sloppy on the staging server. Thanks, Will ~| Download the latest ColdFusion 8 utilities including Report Builder, plug-ins for Eclipse and Dreamweaver updates. http;//www.adobe.com/cfusion/entitlement/index.cfm?e=labs%5adobecf8%5Fbeta Archive: http://www.houseoffusion.com/groups/CF-Talk/message.cfm/messageid:287629 Subscription: http://www.houseoffusion.com/groups/CF-Talk/subscribe.cfm Unsubscribe: http://www.houseoffusion.com/cf_lists/unsubscribe.cfm?user=11502.10531.4
Re: OT: CSS menu looks great on its own - looks jacked up on site
Yo Will, I only messed with it a second (I LOVE firefox and the plugin that lets you edit CSS on the fly ;) but by adding a float to the menu CSS it sorta almost works. In Firefox, at least. :) Here's the effected block of CSS from acapellamenu2.css: (all I added was the float at the bottom- dunno if it works in IE) acappellamenu2.css : ..menu { width:750px; font-size:1.0em; position:relative; z-index:100; text-align:center; padding:0px; float:right; } The menu is a bit to wide for the box, but it's close. Force be with you, Tomlinson! =D On 9/2/07, Will Tomlinson [EMAIL PROTECTED] wrote: This isn't really cf-related, but I was hired to build a dropdown menu for an e-comm site. The menu looks/work fantastic on its own page, but is really screwed on their staging server. Now, their code is incredibly sloppy. There's not even a doctype. I still figured I could make it look right nonetheless. Here it is on MY server (Beautiful): http://capublish.com/menutest.cfm Here's on the staging server (Way jacked up): http://audition.commercev3.com/ Don't anybody spend much time. I just thought somebody could steer me in the right direction since I've banged my head against the wall too long on this. I'm wonderin if it's just the fact that the code is so sloppy on the staging server. Thanks, Will ~| Get involved in the latest ColdFusion discussions, product development sharing, and articles on the Adobe Labs wiki. http://labs/adobe.com/wiki/index.php/ColdFusion_8 Archive: http://www.houseoffusion.com/groups/CF-Talk/message.cfm/messageid:287635 Subscription: http://www.houseoffusion.com/groups/CF-Talk/subscribe.cfm Unsubscribe: http://www.houseoffusion.com/cf_lists/unsubscribe.cfm?user=11502.10531.4
Re: OT: CSS Question
Rick Faircloth wrote: Hi, all... I'm wondering if anyone knows why and what to do about aligning a div background image to the right top corner of a div. IE 7 and FF display it as expected...IE 6 just leaves it in the *left* upper corner. Here's the code: div class=section style=width:100%; height:200px; background:url(images/dove-section-bg.png) top right no-repeat; /div Rick, That code snippet you provided works fine in IE6 at my end (in isolation), so something else is going on. Seeing the page in question would really help define exactly what - do you have a link for perusal? Mark ~| Create Web Applications With ColdFusion MX7 Flex 2. Build powerful, scalable RIAs. Free Trial http://www.adobe.com/products/coldfusion/flex2/?sdid=RVJS Archive: http://www.houseoffusion.com/groups/CF-Talk/message.cfm/messageid:280743 Subscription: http://www.houseoffusion.com/groups/CF-Talk/subscribe.cfm Unsubscribe: http://www.houseoffusion.com/cf_lists/unsubscribe.cfm?user=11502.10531.4
Re: OT: CSS Question
I will have to agree, works here too. but one thing I have also noticed is that in some case of heritance of styles, the image class needs to have margin-left: auto; and margin-right: auto; I have also found that in fireDebug, if you start to disable inherit css elements you can quickly identify the problem too. On 6/12/07, Mark Henderson [EMAIL PROTECTED] wrote: Rick Faircloth wrote: Hi, all... I'm wondering if anyone knows why and what to do about aligning a div background image to the right top corner of a div. IE 7 and FF display it as expected...IE 6 just leaves it in the *left* upper corner. Here's the code: div class=section style=width:100%; height:200px; background:url(images/dove-section-bg.png) top right no-repeat; /div Rick, That code snippet you provided works fine in IE6 at my end (in isolation), so something else is going on. Seeing the page in question would really help define exactly what - do you have a link for perusal? Mark ~| ColdFusion MX7 and Flex 2 Build sales marketing dashboard RIAâs for your business. Upgrade now http://www.adobe.com/products/coldfusion/flex2?sdid=RVJT Archive: http://www.houseoffusion.com/groups/CF-Talk/message.cfm/messageid:280744 Subscription: http://www.houseoffusion.com/groups/CF-Talk/subscribe.cfm Unsubscribe: http://www.houseoffusion.com/cf_lists/unsubscribe.cfm?user=89.70.4
RE: OT: CSS Question
Hi, Andrew... check out my response to Mark Mik for the explanation I came upon for the problem. Let me know if you don't see it. Rick -Original Message- From: Andrew Scott [mailto:[EMAIL PROTECTED] Sent: Tuesday, June 12, 2007 5:29 AM To: CF-Talk Subject: Re: OT: CSS Question I will have to agree, works here too. but one thing I have also noticed is that in some case of heritance of styles, the image class needs to have margin-left: auto; and margin-right: auto; I have also found that in fireDebug, if you start to disable inherit css elements you can quickly identify the problem too. On 6/12/07, Mark Henderson [EMAIL PROTECTED] wrote: Rick Faircloth wrote: Hi, all... I'm wondering if anyone knows why and what to do about aligning a div background image to the right top corner of a div. IE 7 and FF display it as expected...IE 6 just leaves it in the *left* upper corner. Here's the code: div class=section style=width:100%; height:200px; background:url(images/dove-section-bg.png) top right no-repeat; /div Rick, That code snippet you provided works fine in IE6 at my end (in isolation), so something else is going on. Seeing the page in question would really help define exactly what - do you have a link for perusal? Mark ~| Create robust enterprise, web RIAs. Upgrade integrate Adobe Coldfusion MX7 with Flex 2 http://www.adobe.com/products/coldfusion/flex2/?sdid=RVJP Archive: http://www.houseoffusion.com/groups/CF-Talk/message.cfm/messageid:280745 Subscription: http://www.houseoffusion.com/groups/CF-Talk/subscribe.cfm Unsubscribe: http://www.houseoffusion.com/cf_lists/unsubscribe.cfm?user=89.70.4
RE: OT: CSS Question
Oh, and I meant to give you and Mik a link to show what I'm working on... http://hfumc.whitestonemedia.com Looks fine in IE7 and FF2, which support png transparency, but not in IE6 where I have to use the AlphaImageTransparency filter... :o( Rick -Original Message- From: Mark Henderson [mailto:[EMAIL PROTECTED] Sent: Tuesday, June 12, 2007 4:53 AM To: CF-Talk Subject: Re: OT: CSS Question Rick Faircloth wrote: Hi, all... I'm wondering if anyone knows why and what to do about aligning a div background image to the right top corner of a div. IE 7 and FF display it as expected...IE 6 just leaves it in the *left* upper corner. Here's the code: div class=section style=width:100%; height:200px; background:url(images/dove-section-bg.png) top right no-repeat; /div Rick, That code snippet you provided works fine in IE6 at my end (in isolation), so something else is going on. Seeing the page in question would really help define exactly what - do you have a link for perusal? Mark ~| Macromedia ColdFusion MX7 Upgrade to MX7 experience time-saving features, more productivity. http://www.adobe.com/products/coldfusion?sdid=RVJW Archive: http://www.houseoffusion.com/groups/CF-Talk/message.cfm/messageid:280746 Subscription: http://www.houseoffusion.com/groups/CF-Talk/subscribe.cfm Unsubscribe: http://www.houseoffusion.com/cf_lists/unsubscribe.cfm?user=11502.10531.4
RE: OT: CSS Question
I may just have to give up my gradient background image for the mid-section and go to a white background and just give my images a white background and avoid the AlphaImageTransparency filter, altogether. That way I can CSS positioning on the background element... Rick -Original Message- From: Mark Henderson [mailto:[EMAIL PROTECTED] Sent: Tuesday, June 12, 2007 4:53 AM To: CF-Talk Subject: Re: OT: CSS Question Rick Faircloth wrote: Hi, all... I'm wondering if anyone knows why and what to do about aligning a div background image to the right top corner of a div. IE 7 and FF display it as expected...IE 6 just leaves it in the *left* upper corner. Here's the code: div class=section style=width:100%; height:200px; background:url(images/dove-section-bg.png) top right no-repeat; /div Rick, That code snippet you provided works fine in IE6 at my end (in isolation), so something else is going on. Seeing the page in question would really help define exactly what - do you have a link for perusal? Mark ~| ColdFusion MX7 by Adobe® Dyncamically transform webcontent into Adobe PDF with new ColdFusion MX7. Free Trial. http://www.adobe.com/products/coldfusion?sdid=RVJV Archive: http://www.houseoffusion.com/groups/CF-Talk/message.cfm/messageid:280747 Subscription: http://www.houseoffusion.com/groups/CF-Talk/subscribe.cfm Unsubscribe: http://www.houseoffusion.com/cf_lists/unsubscribe.cfm?user=89.70.4
RE: OT: CSS Question
Hi, Mark Mik... I figured out what was causing the problem after I posted. I'm using the Microsoft AlphaImageLoader filter to create a pseudo transparency for the .png and the filter actually creates a new image, which is not a true background image, therefore the typical CSS background attributes don't apply. My only other option, that I'm aware of, is to use absolute positioning of the div's to create an overlap. That is the only way to get two div's to overlap, isn't it? I tried every other way, including using z-index and floating without absolute positioning, but could get everything to stack up. Thoughts, Thanks, Rick -Original Message- From: Mark Henderson [mailto:[EMAIL PROTECTED] Sent: Tuesday, June 12, 2007 4:53 AM To: CF-Talk Subject: Re: OT: CSS Question Rick Faircloth wrote: Hi, all... I'm wondering if anyone knows why and what to do about aligning a div background image to the right top corner of a div. IE 7 and FF display it as expected...IE 6 just leaves it in the *left* upper corner. Here's the code: div class=section style=width:100%; height:200px; background:url(images/dove-section-bg.png) top right no-repeat; /div Rick, That code snippet you provided works fine in IE6 at my end (in isolation), so something else is going on. Seeing the page in question would really help define exactly what - do you have a link for perusal? Mark ~| Create robust enterprise, web RIAs. Upgrade integrate Adobe Coldfusion MX7 with Flex 2 http://www.adobe.com/products/coldfusion/flex2/?sdid=RVJP Archive: http://www.houseoffusion.com/groups/CF-Talk/message.cfm/messageid:280748 Subscription: http://www.houseoffusion.com/groups/CF-Talk/subscribe.cfm Unsubscribe: http://www.houseoffusion.com/cf_lists/unsubscribe.cfm?user=11502.10531.4
OT: CSS Question
Hi, all... I hope everyone doesn't mind an OT question, but I can't find an answer anywhere and the css list I'm on isn't responding. Here's my post to the other list. I'd appreciate any clues anyone might have. Thanks, Rick Hi, all... I'm wondering if anyone knows why and what to do about aligning a div background image to the right top corner of a div. IE 7 and FF display it as expected...IE 6 just leaves it in the *left* upper corner. Here's the code: div class=section style=width:100%; height:200px; background:url(images/dove-section-bg.png) top right no-repeat; /div The class, section, just defines the class as margin:10px 0px 0px 16px; text-align:justify; If I can just get that blasted bird in the upper-right corner of my div in IE 6, I'll be a happy coder! (For the moment...) Ideas, anyone? Work-a-rounds? Thanks, Rick ~| Create Web Applications With ColdFusion MX7 Flex 2. Build powerful, scalable RIAs. Free Trial http://www.adobe.com/products/coldfusion/flex2/?sdid=RVJS Archive: http://www.houseoffusion.com/groups/CF-Talk/message.cfm/messageid:280720 Subscription: http://www.houseoffusion.com/groups/CF-Talk/subscribe.cfm Unsubscribe: http://www.houseoffusion.com/cf_lists/unsubscribe.cfm?user=89.70.4
Re: OT: CSS Question
How about: { background-image: url('images/dove-section-bg.png'); background-repeat: no-repeat; background-position: 100% 0px; } Mik IE 7 and FF display it as expected...IE 6 just leaves it in the *left* upper corner. Here's the code: div class=section style=width:100%; height:200px; background:url(images/dove-section-bg.png) top right no-repeat; /div The class, section, just defines the class as margin:10px 0px 0px 16px; text-align:justify; If I can just get that blasted bird in the upper-right corner of my div in IE 6, I'll be a happy coder! (For the moment...) Ideas, anyone? Work-a-rounds? Thanks, Rick Michael Muller Admin, MontagueMA.net Website work (413) 863-0030 cell (413) 320-5336 skype: michaelBmuller http://www.MontagueMA.net Eschew Obfuscation ~| Upgrade to Adobe ColdFusion MX7 The most significant release in over 10 years. Upgrade see new features. http://www.adobe.com/products/coldfusion?sdid=RVJR Archive: http://www.houseoffusion.com/groups/CF-Talk/message.cfm/messageid:280734 Subscription: http://www.houseoffusion.com/groups/CF-Talk/subscribe.cfm Unsubscribe: http://www.houseoffusion.com/cf_lists/unsubscribe.cfm?user=89.70.4
OT: css menu troubles
Sorry for this being off topic but I know there are people on this list whose CSS knowledge exceeds my own. I have a problem that I've run into before and my company had to outsource it to a CSS Guru (Sandra Clark). While I truly appreciated her help the last time, I want to work through this myself. I have a page with a navigation menu across the top with a single level dropdown and a sub-nav menu on the left sidebar. My problem (IE only) is that the dropdown from the main navigation menu appears under the side navigation menu. In firefox it works correctly. This project is very time-sensitive so I'm trying to work through this as quickly as possible. The page url is http://cfas2.cfwebtools.com/index.cfm?objectid=E6D20202-9027-F64A-799622C32F C8C158. I'm fairly decent with CSS but when it comes to more advanced issues like this I'm still a noob. Can anyone help me out? Thanks! PS. I didn't post any code because there's a lot of it. If you need any of it, please let me know and I'll supply it. _ Jake Churchill CF Webtools 11204 Davenport, Ste. 200b Omaha, NE 68154 http://www.cfwebtools.com 402-408-3733 x103 ~| ColdFusion MX7 and Flex 2 Build sales marketing dashboard RIAâs for your business. Upgrade now http://www.adobe.com/products/coldfusion/flex2?sdid=RVJT Archive: http://www.houseoffusion.com/groups/CF-Talk/message.cfm/messageid:275141 Subscription: http://www.houseoffusion.com/groups/CF-Talk/subscribe.cfm Unsubscribe: http://www.houseoffusion.com/cf_lists/unsubscribe.cfm?user=11502.10531.4
OT: css n00b question
I am trying my first css design and was wondering how to accomplish something. Say I have a container div which contains left, right and center columns and then below those three columns I want another div with spacing between the three columns above it, how would I accomplish this correctly? Would I use padding-top on the bottom div? I have tried using margin-top but that moves all the divs down and not just that one div. Any help appreciated Doug ~| Create robust enterprise, web RIAs. Upgrade integrate Adobe Coldfusion MX7 with Flex 2 http://www.adobe.com/products/coldfusion/flex2/?sdid=RVJP Archive: http://www.houseoffusion.com/groups/CF-Talk/message.cfm/messageid:273509 Subscription: http://www.houseoffusion.com/groups/CF-Talk/subscribe.cfm Unsubscribe: http://www.houseoffusion.com/cf_lists/unsubscribe.cfm?user=89.70.4
Re: OT: css n00b question
I prefer using margin when I'm creating space between containers and padding when I'm trying to create space between content and the container edge. I just find it easier to think about that way, I guess. I don't know why margin isn't working for you, though. Can you post a *snippet* of the css? On 3/23/07, Doug Brown [EMAIL PROTECTED] wrote: I am trying my first css design and was wondering how to accomplish something. Say I have a container div which contains left, right and center columns and then below those three columns I want another div with spacing between the three columns above it, how would I accomplish this correctly? Would I use padding-top on the bottom div? I have tried using margin-top but that moves all the divs down and not just that one div. Any help appreciated Doug ~| Upgrade to Adobe ColdFusion MX7 Experience Flex 2 MX7 integration create powerful cross-platform RIAs http://www.adobe.com/products/coldfusion/flex2/?sdid=RVJQ Archive: http://www.houseoffusion.com/groups/CF-Talk/message.cfm/messageid:273510 Subscription: http://www.houseoffusion.com/groups/CF-Talk/subscribe.cfm Unsubscribe: http://www.houseoffusion.com/cf_lists/unsubscribe.cfm?user=11502.10531.4
Re: OT: css n00b question
Hi Doug Yeah I would use something like #bottomContent { width: 600px; padding-top: 10px; background: #ff; } HTH Jose Diaz On 3/23/07, Doug Brown [EMAIL PROTECTED] wrote: I am trying my first css design and was wondering how to accomplish something. Say I have a container div which contains left, right and center columns and then below those three columns I want another div with spacing between the three columns above it, how would I accomplish this correctly? Would I use padding-top on the bottom div? I have tried using margin-top but that moves all the divs down and not just that one div. Any help appreciated Doug ~| ColdFusion MX7 by Adobe® Dyncamically transform webcontent into Adobe PDF with new ColdFusion MX7. Free Trial. http://www.adobe.com/products/coldfusion?sdid=RVJV Archive: http://www.houseoffusion.com/groups/CF-Talk/message.cfm/messageid:273511 Subscription: http://www.houseoffusion.com/groups/CF-Talk/subscribe.cfm Unsubscribe: http://www.houseoffusion.com/cf_lists/unsubscribe.cfm?user=89.70.4
RE: OT: css n00b question
Rob, Actually the margin-top works in IE but breaks in FF div id=container div id=mainMain Column/div div id=leftcolumnLeft column/div div id=rightcolumnRight column/div div id=threecolumnbottomThe column/div /div body, form, p { margin: 0px; padding: 0px; } #container { width: 970px; margin-left: auto; margin-right: auto; } #leftcolumn { width: 140px; border: 1px solid #000; float: left; margin-left: -828px; background-color: Gray; } #rightcolumn{ width: 140px; border: 1px solid #000; float: left; background-color: Fuchsia; } #threecolumnbottom { margin-top: 100px; width: 968px; border: 1px solid #000; } #main { width: 664px; margin-left: 152px; margin-right: 10px; float: left; border: 1px solid #000; display: inline; background-color: Lime; text-align: center; } -Original Message- From: Rob Wilkerson [mailto:[EMAIL PROTECTED] Sent: Friday, March 23, 2007 7:15 AM To: CF-Talk Subject: Re: OT: css n00b question I prefer using margin when I'm creating space between containers and padding when I'm trying to create space between content and the container edge. I just find it easier to think about that way, I guess. I don't know why margin isn't working for you, though. Can you post a *snippet* of the css? On 3/23/07, Doug Brown [EMAIL PROTECTED] wrote: I am trying my first css design and was wondering how to accomplish something. Say I have a container div which contains left, right and center columns and then below those three columns I want another div with spacing between the three columns above it, how would I accomplish this correctly? Would I use padding-top on the bottom div? I have tried using margin-top but that moves all the divs down and not just that one div. Any help appreciated Doug ~| Macromedia ColdFusion MX7 Upgrade to MX7 experience time-saving features, more productivity. http://www.adobe.com/products/coldfusion?sdid=RVJW Archive: http://www.houseoffusion.com/groups/CF-Talk/message.cfm/messageid:273512 Subscription: http://www.houseoffusion.com/groups/CF-Talk/subscribe.cfm Unsubscribe: http://www.houseoffusion.com/cf_lists/unsubscribe.cfm?user=11502.10531.4
RE: OT: css n00b question
Hello Doug, I'm unable to test this, but you may want to try something like this. div class=col /div div class=col /div div class=col /div div class=clearer/div div class=bottom /div div.col { float:left; margin-right:10px; } div.clearer { clear:both; } div.bottom { margin-top:10px; } Give it a shot. Rob -Original Message- From: Rob Wilkerson [mailto:[EMAIL PROTECTED] Sent: 23 March 2007 13:15 To: CF-Talk Subject: Re: OT: css n00b question I prefer using margin when I'm creating space between containers and padding when I'm trying to create space between content and the container edge. I just find it easier to think about that way, I guess. I don't know why margin isn't working for you, though. Can you post a *snippet* of the css? On 3/23/07, Doug Brown [EMAIL PROTECTED] wrote: I am trying my first css design and was wondering how to accomplish something. Say I have a container div which contains left, right and center columns and then below those three columns I want another div with spacing between the three columns above it, how would I accomplish this correctly? Would I use padding-top on the bottom div? I have tried using margin-top but that moves all the divs down and not just that one div. Any help appreciated Doug ~| Deploy Web Applications Quickly across the enterprise with ColdFusion MX7 Flex 2 Free Trial http://www.adobe.com/products/coldfusion/flex2/?sdid=RVJU Archive: http://www.houseoffusion.com/groups/CF-Talk/message.cfm/messageid:273513 Subscription: http://www.houseoffusion.com/groups/CF-Talk/subscribe.cfm Unsubscribe: http://www.houseoffusion.com/cf_lists/unsubscribe.cfm?user=11502.10531.4
Re: OT: css n00b question
Hi Doug Sorry Margin is correct lol ignore my previous post ;) Jose On 3/23/07, Jose Diaz [EMAIL PROTECTED] wrote: Hi Doug Yeah I would use something like #bottomContent { width: 600px; padding-top: 10px; background: #ff ; } HTH Jose Diaz On 3/23/07, Doug Brown [EMAIL PROTECTED] wrote: I am trying my first css design and was wondering how to accomplish something. Say I have a container div which contains left, right and center columns and then below those three columns I want another div with spacing between the three columns above it, how would I accomplish this correctly? Would I use padding-top on the bottom div? I have tried using margin-top but that moves all the divs down and not just that one div. Any help appreciated Doug ~| Upgrade to Adobe ColdFusion MX7 The most significant release in over 10 years. Upgrade see new features. http://www.adobe.com/products/coldfusion?sdid=RVJR Archive: http://www.houseoffusion.com/groups/CF-Talk/message.cfm/messageid:273514 Subscription: http://www.houseoffusion.com/groups/CF-Talk/subscribe.cfm Unsubscribe: http://www.houseoffusion.com/cf_lists/unsubscribe.cfm?user=89.70.4
RE: OT: css n00b question
Unable to test? Don't have a browser installed on your computer? :) -Original Message- From: Robert Rawlins - Think Blue [mailto:[EMAIL PROTECTED] Sent: Friday, March 23, 2007 8:20 AM To: CF-Talk Subject: RE: OT: css n00b question Hello Doug, I'm unable to test this, but you may want to try something like this. ~| Upgrade to Adobe ColdFusion MX7 The most significant release in over 10 years. Upgrade see new features. http://www.adobe.com/products/coldfusion?sdid=RVJR Archive: http://www.houseoffusion.com/groups/CF-Talk/message.cfm/messageid:273515 Subscription: http://www.houseoffusion.com/groups/CF-Talk/subscribe.cfm Unsubscribe: http://www.houseoffusion.com/cf_lists/unsubscribe.cfm?user=11502.10531.4
Re: OT: css n00b question
Hi Doug Rob is spot on with the clear suggestion, i had a similar problem and have just checked what I did and the solution was: ..clear { clear:both } Jose On 3/23/07, Andy Matthews [EMAIL PROTECTED] wrote: Unable to test? Don't have a browser installed on your computer? :) -Original Message- From: Robert Rawlins - Think Blue [mailto:[EMAIL PROTECTED] Sent: Friday, March 23, 2007 8:20 AM To: CF-Talk Subject: RE: OT: css n00b question Hello Doug, I'm unable to test this, but you may want to try something like this. ~| Create robust enterprise, web RIAs. Upgrade integrate Adobe Coldfusion MX7 with Flex 2 http://www.adobe.com/products/coldfusion/flex2/?sdid=RVJP Archive: http://www.houseoffusion.com/groups/CF-Talk/message.cfm/messageid:273517 Subscription: http://www.houseoffusion.com/groups/CF-Talk/subscribe.cfm Unsubscribe: http://www.houseoffusion.com/cf_lists/unsubscribe.cfm?user=89.70.4
RE: OT: css n00b question
No, no, I'm just lazy ;-) -Original Message- From: Andy Matthews [mailto:[EMAIL PROTECTED] Sent: 23 March 2007 13:24 To: CF-Talk Subject: RE: OT: css n00b question Unable to test? Don't have a browser installed on your computer? :) -Original Message- From: Robert Rawlins - Think Blue [mailto:[EMAIL PROTECTED] Sent: Friday, March 23, 2007 8:20 AM To: CF-Talk Subject: RE: OT: css n00b question Hello Doug, I'm unable to test this, but you may want to try something like this. ~| ColdFusion MX7 by Adobe® Dyncamically transform webcontent into Adobe PDF with new ColdFusion MX7. Free Trial. http://www.adobe.com/products/coldfusion?sdid=RVJV Archive: http://www.houseoffusion.com/groups/CF-Talk/message.cfm/messageid:273518 Subscription: http://www.houseoffusion.com/groups/CF-Talk/subscribe.cfm Unsubscribe: http://www.houseoffusion.com/cf_lists/unsubscribe.cfm?user=89.70.4
RE: OT: css n00b question
Robert, Thanks a lot that seems to do the trick...Back to the learning drawing board :) Doug -Original Message- From: Robert Rawlins - Think Blue [mailto:[EMAIL PROTECTED] Sent: Friday, March 23, 2007 7:20 AM To: CF-Talk Subject: RE: OT: css n00b question Hello Doug, I'm unable to test this, but you may want to try something like this. div class=col /div div class=col /div div class=col /div div class=clearer/div div class=bottom /div div.col { float:left; margin-right:10px; } div.clearer { clear:both; } div.bottom { margin-top:10px; } Give it a shot. Rob -Original Message- From: Rob Wilkerson [mailto:[EMAIL PROTECTED] Sent: 23 March 2007 13:15 To: CF-Talk Subject: Re: OT: css n00b question I prefer using margin when I'm creating space between containers and padding when I'm trying to create space between content and the container edge. I just find it easier to think about that way, I guess. I don't know why margin isn't working for you, though. Can you post a *snippet* of the css? On 3/23/07, Doug Brown [EMAIL PROTECTED] wrote: I am trying my first css design and was wondering how to accomplish something. Say I have a container div which contains left, right and center columns and then below those three columns I want another div with spacing between the three columns above it, how would I accomplish this correctly? Would I use padding-top on the bottom div? I have tried using margin-top but that moves all the divs down and not just that one div. Any help appreciated Doug ~| Macromedia ColdFusion MX7 Upgrade to MX7 experience time-saving features, more productivity. http://www.adobe.com/products/coldfusion?sdid=RVJW Archive: http://www.houseoffusion.com/groups/CF-Talk/message.cfm/messageid:273519 Subscription: http://www.houseoffusion.com/groups/CF-Talk/subscribe.cfm Unsubscribe: http://www.houseoffusion.com/cf_lists/unsubscribe.cfm?user=11502.10531.4
RE: OT: css n00b question
Glad to hear it Doug, If you've got any other questions then feel free to ask :-D Once you get your head around CSS you'll fall in love with it. Rob -Original Message- From: Doug Brown [mailto:[EMAIL PROTECTED] Sent: 23 March 2007 13:30 To: CF-Talk Subject: RE: OT: css n00b question Robert, Thanks a lot that seems to do the trick...Back to the learning drawing board :) Doug -Original Message- From: Robert Rawlins - Think Blue [mailto:[EMAIL PROTECTED] Sent: Friday, March 23, 2007 7:20 AM To: CF-Talk Subject: RE: OT: css n00b question Hello Doug, I'm unable to test this, but you may want to try something like this. div class=col /div div class=col /div div class=col /div div class=clearer/div div class=bottom /div div.col { float:left; margin-right:10px; } div.clearer { clear:both; } div.bottom { margin-top:10px; } Give it a shot. Rob -Original Message- From: Rob Wilkerson [mailto:[EMAIL PROTECTED] Sent: 23 March 2007 13:15 To: CF-Talk Subject: Re: OT: css n00b question I prefer using margin when I'm creating space between containers and padding when I'm trying to create space between content and the container edge. I just find it easier to think about that way, I guess. I don't know why margin isn't working for you, though. Can you post a *snippet* of the css? On 3/23/07, Doug Brown [EMAIL PROTECTED] wrote: I am trying my first css design and was wondering how to accomplish something. Say I have a container div which contains left, right and center columns and then below those three columns I want another div with spacing between the three columns above it, how would I accomplish this correctly? Would I use padding-top on the bottom div? I have tried using margin-top but that moves all the divs down and not just that one div. Any help appreciated Doug ~| Create Web Applications With ColdFusion MX7 Flex 2. Build powerful, scalable RIAs. Free Trial http://www.adobe.com/products/coldfusion/flex2/?sdid=RVJS Archive: http://www.houseoffusion.com/groups/CF-Talk/message.cfm/messageid:273521 Subscription: http://www.houseoffusion.com/groups/CF-Talk/subscribe.cfm Unsubscribe: http://www.houseoffusion.com/cf_lists/unsubscribe.cfm?user=89.70.4
OT: CSS Firefox vs. IE Question...
I am developing a site that displays fine in Firefox but not in IE. I am new to CSS and I could use some insight as to what my problem might be. The link and the style sheet are below. Thanks! http://www.buickpartspage.com/ /* CSS Document */ body { background:url(images/header_px.jpg) left top repeat-x #F3F3EB; color:#A39F90; padding:0px 0px 0px 0px; margin:0px 0px 0px 0px; } a { color:#A37D21; text-decoration:underline; } a:hover { color:#A37D21; text-decoration:none } ..pagetitle { padding:14px 0px 15px 25px; margin:0px 0px 0px 0px; } p { padding:0px 0px 0px 0px; margin:0px 0px 0px 0px; } html { font-size:11px; font-family:tahoma, arial; } ..normal { font-size:1.01em; font-family:tahoma, arial; } ..big { font-size:1.31em; font-family:tahoma, arial; } ..small { font-size:0.91em; font-family:tahoma, arial; } h1 { font-family:arial, tahoma, times new roman; color:#FF; font-size:3.01em; font-weight:normal; line-height:1.01em; padding:0px 0px 0px 0px; margin:0px 0px 0px 0px; } h2 { color:#A37D21; font-size:1.01em; text-transform:uppercase; padding:0px 0px 0px 0px; margin:0px 0px 0px 0px; } h3 { color:#A37D21; font-size:1.01em; text-transform:uppercase; padding:0px 0px 0px 0px; margin:0px 0px 0px 0px; } ..content_txt h2 a { color:#A37D21; text-decoration:none; } ..content_txt h2 a:hover { color:#A37D21; text-decoration:none; } ..h2 { font-size:1.01em; line-height:1.01em; color:#303030; text-transform:none; padding:0px 0px 0px 15px; margin:0px 0px 0px 0px; } ..header { width:766px; height:249px; vertical-align:top; background:url(images/header.jpg) left bottom no-repeat; } ..table1 { width:766px; display:table; } ..table_row1 { width:766px; height:100%; display:table-row; } ..left1 { width:388px; height:100%; vertical-align:top; display:table-cell; text-align:left; } ..co_name { vertical-align:top; padding:15px 10px 15px 10px; } ..co_name a { color:#FF; text-decoration:none; } ..co_name a:hover { color:#FF; text-decoration:none; } ..slogan { vertical-align:top; padding:0px 0px 0px 2px; color:#BEBEBE; } ..right1 { width:378px; height:100%; vertical-align:top; display:table-cell; text-align:left; } #topnav { vertical-align:top; padding:30px 10px 15px 10px; } #topnav a { color:#FF; text-decoration:none; } #topnav a:hover { color:#FF; text-decoration:underline; } ..cent #search { vertical-align:top; padding:10px 0px 0px 0px; margin:0px 0px 0px 0px; color:#A37D21; } ..cent #search strong { color:#A37D21; text-transform:uppercase; } ..cent #search input { font-size:11px; color:#303030; font-family:Tahoma, arial, verdana, courier; width:144px; height:17px; border:inset 1px #D4D0C8; padding:0px 0px 0px 0px; margin:0px 7px 0px 9px; vertical-align:middle; } ..cent #search .input { width:55px; height:17px; border:none; padding:0px 0px 0px 0px; margin:0px 0px 0px 0px; vertical-align:middle; } ..table { width:766px; display:table; } ..table_row { width:766px; height:100%; display:table-row; } ..left { width:192px; height:100%; vertical-align:top; display:table-cell; text-align:left; } ..cent { width:375px; height:100%; vertical-align:top; display:table-cell; text-align:left; } ..right { width:199px; height:100%; vertical-align:top; display:table-cell; text-align:left; } ..head_bg { background:url(images/head_bg.jpg) left top repeat-y #E7E3D5; vertical-align:top; width:375px; } ..table2 { width:375px; display:table; } ..table_row2 { width:375px; height:100%; display:table-row; } ..left2 { width:252px; height:100%; vertical-align:top; display:table-cell; text-align:left; background:url(images/head.jpg) left top no-repeat; } ..right2 { width:123px; height:100%; vertical-align:top; display:table-cell; text-align:left; background:url(images/date.jpg) left top no-repeat; } ..head { padding:14px 5px 15px 50px; color:#454545;
Re: OT: CSS Firefox vs. IE Question...
Take a look at www.positioniseverything.net They have all the well-known IE CSS browser bugs listed, along with fixes. On 3/20/07, Che Vilnonis [EMAIL PROTECTED] wrote: I am developing a site that displays fine in Firefox but not in IE. I am new to CSS and I could use some insight as to what my problem might be. The link and the style sheet are below. Thanks! ~| ColdFusion MX7 and Flex 2 Build sales marketing dashboard RIAâs for your business. Upgrade now http://www.adobe.com/products/coldfusion/flex2?sdid=RVJT Archive: http://www.houseoffusion.com/groups/CF-Talk/message.cfm/messageid:273086 Subscription: http://www.houseoffusion.com/groups/CF-Talk/subscribe.cfm Unsubscribe: http://www.houseoffusion.com/cf_lists/unsubscribe.cfm?user=89.70.4
RE: OT: CSS Firefox vs. IE Question...
Thanks Kris. I don't think it's a compatibility issue. The CSS used to work in IE, but for the life of me I cannot figure out where I made a mistake while editing. Care to take a look? Che -Original Message- From: Kris Jones [mailto:[EMAIL PROTECTED] Sent: Tuesday, March 20, 2007 8:48 AM To: CF-Talk Subject: Re: OT: CSS Firefox vs. IE Question... Take a look at www.positioniseverything.net They have all the well-known IE CSS browser bugs listed, along with fixes. On 3/20/07, Che Vilnonis [EMAIL PROTECTED] wrote: I am developing a site that displays fine in Firefox but not in IE. I am new to CSS and I could use some insight as to what my problem might be. The link and the style sheet are below. Thanks! ~| Upgrade to Adobe ColdFusion MX7 The most significant release in over 10 years. Upgrade see new features. http://www.adobe.com/products/coldfusion?sdid=RVJR Archive: http://www.houseoffusion.com/groups/CF-Talk/message.cfm/messageid:273090 Subscription: http://www.houseoffusion.com/groups/CF-Talk/subscribe.cfm Unsubscribe: http://www.houseoffusion.com/cf_lists/unsubscribe.cfm?user=89.70.4
OT: CSS help?
Hey all, I'm having an issue where I can't get rid of space above a div in Firefox. It's like the top margin is about 15 pixels. I tried setting margin and padding to 0px, no dice. It appears exactly as I would expect in IE, with the div right below the preceding text. Basically the code is like this: pHeader textbr div class=myclassDiv text/div /p On FF, there is about 15 pixel gap between Header text and Div Text -- on IE there is just the normal line space gap that would be expected. I tried taking out the br, no change. I searched Google and didn't find anything that helped me. I know there are some CSS gurus on this list so I'm hoping this is a known issue with a workaround, or someone can help. -- Josh ~| Macromedia ColdFusion MX7 Upgrade to MX7 experience time-saving features, more productivity. http://www.adobe.com/products/coldfusion?sdid=RVJW Archive: http://www.houseoffusion.com/groups/CF-Talk/message.cfm/messageid:272865 Subscription: http://www.houseoffusion.com/groups/CF-Talk/subscribe.cfm Unsubscribe: http://www.houseoffusion.com/cf_lists/unsubscribe.cfm?user=11502.10531.4
Re: OT: CSS help?
p style=margin:0px;Header text div class=myclassDiv text/div /p On 3/16/07, Josh Nathanson [EMAIL PROTECTED] wrote: Hey all, I'm having an issue where I can't get rid of space above a div in Firefox. It's like the top margin is about 15 pixels. I tried setting margin and padding to 0px, no dice. It appears exactly as I would expect in IE, with the div right below the preceding text. Basically the code is like this: pHeader textbr div class=myclassDiv text/div /p On FF, there is about 15 pixel gap between Header text and Div Text -- on IE there is just the normal line space gap that would be expected. I tried taking out the br, no change. I searched Google and didn't find anything that helped me. I know there are some CSS gurus on this list so I'm hoping this is a known issue with a workaround, or someone can help. -- Josh ~| ColdFusion MX7 by Adobe® Dyncamically transform webcontent into Adobe PDF with new ColdFusion MX7. Free Trial. http://www.adobe.com/products/coldfusion?sdid=RVJV Archive: http://www.houseoffusion.com/groups/CF-Talk/message.cfm/messageid:272874 Subscription: http://www.houseoffusion.com/groups/CF-Talk/subscribe.cfm Unsubscribe: http://www.houseoffusion.com/cf_lists/unsubscribe.cfm?user=89.70.4
Re: OT: CSS help?
p style=margin:0px;Header text div class=myclassDiv text/div /p Thanks Casey, I've decided to just ditch the p tags as they weren't necessary anyway. I'm wrapping the blocks in a div and then setting the top margin of the div to get the spacing I want. Seems to be pretty consistent across browsers that way. Good to know there's a workaround if necessary though. -- Josh ~| Create robust enterprise, web RIAs. Upgrade integrate Adobe Coldfusion MX7 with Flex 2 http://www.adobe.com/products/coldfusion/flex2/?sdid=RVJP Archive: http://www.houseoffusion.com/groups/CF-Talk/message.cfm/messageid:272877 Subscription: http://www.houseoffusion.com/groups/CF-Talk/subscribe.cfm Unsubscribe: http://www.houseoffusion.com/cf_lists/unsubscribe.cfm?user=11502.10531.4
RE: OT: CSS help?
Frankly I'd rather do. div id=thisbox h2Header Text/h2 pOther Text/p /div Styling #thisbox h2 {} or #thisbox p{}. Structural HTML makes things a lot easier. Sandra Clark = http://www.shayna.com Training and Consulting in CSS and Accessibility Team Fusebox -Original Message- From: Casey Dougall [mailto:[EMAIL PROTECTED] Sent: Friday, March 16, 2007 3:33 PM To: CF-Talk Subject: Re: OT: CSS help? p style=margin:0px;Header text div class=myclassDiv text/div /p On 3/16/07, Josh Nathanson [EMAIL PROTECTED] wrote: Hey all, I'm having an issue where I can't get rid of space above a div in Firefox. It's like the top margin is about 15 pixels. I tried setting margin and padding to 0px, no dice. It appears exactly as I would expect in IE, with the div right below the preceding text. Basically the code is like this: pHeader textbr div class=myclassDiv text/div /p On FF, there is about 15 pixel gap between Header text and Div Text -- on IE there is just the normal line space gap that would be expected. I tried taking out the br, no change. I searched Google and didn't find anything that helped me. I know there are some CSS gurus on this list so I'm hoping this is a known issue with a workaround, or someone can help. -- Josh ~| Upgrade to Adobe ColdFusion MX7 The most significant release in over 10 years. Upgrade see new features. http://www.adobe.com/products/coldfusion?sdid=RVJR Archive: http://www.houseoffusion.com/groups/CF-Talk/message.cfm/messageid:272888 Subscription: http://www.houseoffusion.com/groups/CF-Talk/subscribe.cfm Unsubscribe: http://www.houseoffusion.com/cf_lists/unsubscribe.cfm?user=11502.10531.4
OT: CSS
I have a div that is shown when a user clicks on a text field, and it pops up just below that text field (0px below and aligned to the left bottom corner). It seems to work just fine in IE: but in NS and FF the div is about 25 px out of alignment. Any ideas on how to display it the same in all browsers? The text field is in a table and not another div. cfoutput div style=position:absolute; top:82px; left:135px; width:152; background-color:##DAE4E4; border: 1px solid; color:##66; id=script table width=100% cellpadding=1 cellspacing=0 border=0 tr td class=bblackfontRecent Searches/td tdimg src=images/buttn-notok.gif border=0 onclick=showhide('script'); return(false); //td /tr /cfoutput cfif isDefined('cookie.testCookie') cfloop list=#cookie.testCookie# delimiters=, index=i cfoutput tr td colspan=2 class=nblackfonta href=#i#/a/td /tr /cfoutput /cfloop /cfif /table /div Doug B. ~| Upgrade to Adobe ColdFusion MX7 Experience Flex 2 MX7 integration create powerful cross-platform RIAs http:http://ad.doubleclick.net/clk;56760587;14748456;a?http://www.adobe.com/products/coldfusion/flex2/?sdid=LVNU Archive: http://www.houseoffusion.com/groups/CF-Talk/message.cfm/messageid:267134 Subscription: http://www.houseoffusion.com/groups/CF-Talk/subscribe.cfm Unsubscribe: http://www.houseoffusion.com/cf_lists/unsubscribe.cfm?user=11502.10531.4
OT: CSS Horizontal Centering in IE7
Well, I'm finally getting around to see what all IE7 has broken in my various CSS websites. I was rather surprised to find out that horizontal centering is on the list. For instance, the following does not render properly in IE7: body { margin: 0 auto; } While that *should* have no top/bottom margin, and the body centered on the screen, in IE7 it is now aligned left. I've searched around google to see if I could find any articles regarding this, but have yet to do so. So, if you've run across this and have already found/figured out what IE7 wants to see in order to behave properly, can you please post it? I'm sure there are quite a few people (myself included) who would be most appreciative! Thanks, Matt ~| Create robust enterprise, web RIAs. Upgrade integrate Adobe Coldfusion MX7 with Flex 2 http://ad.doubleclick.net/clk;56760587;14748456;a?http://www.adobe.com/products/coldfusion/flex2/?sdid=LVNU Archive: http://www.houseoffusion.com/groups/CF-Talk/message.cfm/messageid:263570 Subscription: http://www.houseoffusion.com/groups/CF-Talk/subscribe.cfm Unsubscribe: http://www.houseoffusion.com/cf_lists/unsubscribe.cfm?user=89.70.4
Re: OT: CSS Horizontal Centering in IE7
Matt, Check you document declaration. If it is non-existent, incomplete or has syntax errors, the browser will, be default, show the page in 'quirks mode'. On 12/11/06, Matt Quackenbush [EMAIL PROTECTED] wrote: Well, I'm finally getting around to see what all IE7 has broken in my various CSS websites. I was rather surprised to find out that horizontal centering is on the list. For instance, the following does not render properly in IE7: body { margin: 0 auto; } While that *should* have no top/bottom margin, and the body centered on the screen, in IE7 it is now aligned left. I've searched around google to see if I could find any articles regarding this, but have yet to do so. So, if you've run across this and have already found/figured out what IE7 wants to see in order to behave properly, can you please post it? I'm sure there are quite a few people (myself included) who would be most appreciative! Thanks, Matt ~| Create robust enterprise, web RIAs. Upgrade integrate Adobe Coldfusion MX7 with Flex 2 http://ad.doubleclick.net/clk;56760587;14748456;a?http://www.adobe.com/products/coldfusion/flex2/?sdid=LVNU Archive: http://www.houseoffusion.com/groups/CF-Talk/message.cfm/messageid:263573 Subscription: http://www.houseoffusion.com/groups/CF-Talk/subscribe.cfm Unsubscribe: http://www.houseoffusion.com/cf_lists/unsubscribe.cfm?user=11502.10531.4
Re: OT: CSS Horizontal Centering in IE7
Scott, !DOCTYPE html PUBLIC -//W3C//DTD XHTML 1.0 Strict//EN http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd; is what I use. So, unless there's a new one for strict, which I haven't found, unfortunately that's not the problem. :-( By posting that though, does that indicate that you are using the strict doctype declaration, along with the 'margin: 0 auto;' in your pages, and IE7 still horizontally centers them? Thanks, Matt On 12/11/06, Scott Stroz [EMAIL PROTECTED] wrote: Matt, Check you document declaration. If it is non-existent, incomplete or has syntax errors, the browser will, be default, show the page in 'quirks mode'. ~| Create robust enterprise, web RIAs. Upgrade integrate Adobe Coldfusion MX7 with Flex 2 http://ad.doubleclick.net/clk;56760587;14748456;a?http://www.adobe.com/products/coldfusion/flex2/?sdid=LVNU Archive: http://www.houseoffusion.com/groups/CF-Talk/message.cfm/messageid:263581 Subscription: http://www.houseoffusion.com/groups/CF-Talk/subscribe.cfm Unsubscribe: http://www.houseoffusion.com/cf_lists/unsubscribe.cfm?user=89.70.4
RE: OT - CSS Float Image Bottom Right corner of DIV
Still no example huh... -Original Message- From: Denny Valliant [mailto:[EMAIL PROTECTED] Sent: Wednesday, November 08, 2006 2:53 AM To: CF-Talk Subject: Re: OT - CSS Float Image Bottom Right corner of DIV On 11/6/06, Bobby Hartsfield [EMAIL PROTECTED] wrote: but it's pretty tough to look /all/ the way up that high... Especially if you deleted this thread days ago like I did. Yeah, gotta love those subjectless posts, neh? :) ~| Introducing the Fusion Authority Quarterly Update. 80 pages of hard-hitting, up-to-date ColdFusion information by your peers, delivered to your door four times a year. http://www.fusionauthority.com/quarterly Archive: http://www.houseoffusion.com/groups/CF-Talk/message.cfm/messageid:259598 Subscription: http://www.houseoffusion.com/groups/CF-Talk/subscribe.cfm Unsubscribe: http://www.houseoffusion.com/cf_lists/unsubscribe.cfm?user=89.70.4
Re: OT - CSS Float Image Bottom Right corner of DIV
On 11/6/06, Bobby Hartsfield [EMAIL PROTECTED] wrote: but it's pretty tough to look /all/ the way up that high... Especially if you deleted this thread days ago like I did. Yeah, gotta love those subjectless posts, neh? :) ~| Introducing the Fusion Authority Quarterly Update. 80 pages of hard-hitting, up-to-date ColdFusion information by your peers, delivered to your door four times a year. http://www.fusionauthority.com/quarterly Archive: http://www.houseoffusion.com/groups/CF-Talk/message.cfm/messageid:259584 Subscription: http://www.houseoffusion.com/groups/CF-Talk/subscribe.cfm Unsubscribe: http://www.houseoffusion.com/cf_lists/unsubscribe.cfm?user=89.70.4
Re: OT - CSS Float Image Bottom Right corner of DIV
On 11/2/06, Bobby Hartsfield [EMAIL PROTECTED] wrote: If I really cared to look up the ORGINAL 'flippant comment' and the person who posted it, I would have called you Denny. But still no example I see. Or you could have actually read Josh's reply, I guess, where he said who said. =P The orig question was for CSS, IIRC, but it's pretty tough to look /all/ the way up that high... and you know how gmail does subjects... If you're ever late for today... you can say you're early for tomorrow... -some song about jobs =] -Original Message- From: Denny Valliant [mailto:[EMAIL PROTECTED] Sent: Thursday, November 02, 2006 2:12 PM To: CF-Talk Subject: Re: OT - CSS Float Image Bottom Right corner of DIV It was a flippant comment, in response to a flippant comment. Context is cool! ;-) You can call me Denny, btw- although I'm also a person. =] On 11/1/06, Bobby Hartsfield [EMAIL PROTECTED] wrote: Ahh ok sorry. I overlooked the names. SO maybe the person who DID say it can offer an example? I don't really think this falls under the to 'CSS' or to 'Table' debate though. :-) if you can do it in either... id like to see it. -Original Message- From: Josh Nathanson [mailto:[EMAIL PROTECTED] Sent: Wednesday, November 01, 2006 7:20 PM To: CF-Talk Subject: Re: OT - CSS Float Image Bottom Right corner of DIV I said originally it was a hack, and I wasn't the one who said I'd use a table, that was Denny. I just provided an admittedly hack method to achieve the desired result given certain circumstances. But, I would use a table anyway. I can't be stuffed with css layouts most of the time. Call me when someone develops CLS (Cascading Layout Sheets) ;0) -- Josh ~| Introducing the Fusion Authority Quarterly Update. 80 pages of hard-hitting, up-to-date ColdFusion information by your peers, delivered to your door four times a year. http://www.fusionauthority.com/quarterly Archive: http://www.houseoffusion.com/groups/CF-Talk/message.cfm/messageid:259394 Subscription: http://www.houseoffusion.com/groups/CF-Talk/subscribe.cfm Unsubscribe: http://www.houseoffusion.com/cf_lists/unsubscribe.cfm?user=89.70.4
RE: OT - CSS Float Image Bottom Right corner of DIV
but it's pretty tough to look /all/ the way up that high... Especially if you deleted this thread days ago like I did. -Original Message- From: Denny Valliant [mailto:[EMAIL PROTECTED] Sent: Monday, November 06, 2006 8:43 PM To: CF-Talk Subject: Re: OT - CSS Float Image Bottom Right corner of DIV On 11/2/06, Bobby Hartsfield [EMAIL PROTECTED] wrote: If I really cared to look up the ORGINAL 'flippant comment' and the person who posted it, I would have called you Denny. But still no example I see. Or you could have actually read Josh's reply, I guess, where he said who said. =P The orig question was for CSS, IIRC, but it's pretty tough to look /all/ the way up that high... and you know how gmail does subjects... If you're ever late for today... you can say you're early for tomorrow... -some song about jobs =] -Original Message- From: Denny Valliant [mailto:[EMAIL PROTECTED] Sent: Thursday, November 02, 2006 2:12 PM To: CF-Talk Subject: Re: OT - CSS Float Image Bottom Right corner of DIV It was a flippant comment, in response to a flippant comment. Context is cool! ;-) You can call me Denny, btw- although I'm also a person. =] On 11/1/06, Bobby Hartsfield [EMAIL PROTECTED] wrote: Ahh ok sorry. I overlooked the names. SO maybe the person who DID say it can offer an example? I don't really think this falls under the to 'CSS' or to 'Table' debate though. :-) if you can do it in either... id like to see it. -Original Message- From: Josh Nathanson [mailto:[EMAIL PROTECTED] Sent: Wednesday, November 01, 2006 7:20 PM To: CF-Talk Subject: Re: OT - CSS Float Image Bottom Right corner of DIV I said originally it was a hack, and I wasn't the one who said I'd use a table, that was Denny. I just provided an admittedly hack method to achieve the desired result given certain circumstances. But, I would use a table anyway. I can't be stuffed with css layouts most of the time. Call me when someone develops CLS (Cascading Layout Sheets) ;0) -- Josh ~| Introducing the Fusion Authority Quarterly Update. 80 pages of hard-hitting, up-to-date ColdFusion information by your peers, delivered to your door four times a year. http://www.fusionauthority.com/quarterly Archive: http://www.houseoffusion.com/groups/CF-Talk/message.cfm/messageid:259400 Subscription: http://www.houseoffusion.com/groups/CF-Talk/subscribe.cfm Unsubscribe: http://www.houseoffusion.com/cf_lists/unsubscribe.cfm?user=11502.10531.4
Re: OT - CSS Float Image Bottom Right corner of DIV
Another little cheat, but not sure if it would work in your case: div id=container style=width: 200px; height: 300px; div id=right style=float: right; padding-top: 270px; img src=foo.bar height=50 widht=50 alt=foo / /div div id=left Your Text /div /div Nah... doesn't work, well atleast in Firefox. the text will only wrap around the image after the image. http://phat-links.com/img-test.cfm ~| Introducing the Fusion Authority Quarterly Update. 80 pages of hard-hitting, up-to-date ColdFusion information by your peers, delivered to your door four times a year. http://www.fusionauthority.com/quarterly Archive: http://www.houseoffusion.com/groups/CF-Talk/message.cfm/messageid:259210 Subscription: http://www.houseoffusion.com/groups/CF-Talk/subscribe.cfm Unsubscribe: http://www.houseoffusion.com/cf_lists/unsubscribe.cfm?user=89.70.4
Re: OT - CSS Float Image Bottom Right corner of DIV
On 11/1/06, Josh Nathanson [EMAIL PROTECTED] wrote: Caveat: It's not a true float as you have to fix the width of the outer table. But, if you can do that you can achieve the desired effect. Not sure if this is easier than doing the same thing with a div or not. Another little cheat, but not sure if it would work in your case: div id=container style=width: 200px; height: 300px; div id=right style=float: right; padding-top: 270px; img src=foo.bar height=50 widht=50 alt=foo / /div div id=left Your Text /div /div Obviously, you would need to have an idea of the height of the container, or a relative idea of the height of the left div. It should still float right and wrap around the image at the padding that you specify, if i am not mistaken. jc ~| Introducing the Fusion Authority Quarterly Update. 80 pages of hard-hitting, up-to-date ColdFusion information by your peers, delivered to your door four times a year. http://www.fusionauthority.com/quarterly Archive: http://www.houseoffusion.com/groups/CF-Talk/message.cfm/messageid:259192 Subscription: http://www.houseoffusion.com/groups/CF-Talk/subscribe.cfm Unsubscribe: http://www.houseoffusion.com/cf_lists/unsubscribe.cfm?user=11502.10531.4
Re: OT - CSS Float Image Bottom Right corner of DIV
Sandy, you've mentioned these CSS rules a couple of times the past few weeks. Is there a place where all these rules reside in one place? Wasn't there like 72 of them or something? Ray, you might be referring to a post I made while taking tips from sandy a week or so ago. I prob said 72 rules, but was just exaggerating for effect. There were 9 but it seemed like 72 cause each one is a lot to handle (for me anyway). :) Will ~| Introducing the Fusion Authority Quarterly Update. 80 pages of hard-hitting, up-to-date ColdFusion information by your peers, delivered to your door four times a year. http://www.fusionauthority.com/quarterly Archive: http://www.houseoffusion.com/groups/CF-Talk/message.cfm/messageid:258852 Subscription: http://www.houseoffusion.com/groups/CF-Talk/subscribe.cfm Unsubscribe: http://www.houseoffusion.com/cf_lists/unsubscribe.cfm?user=11502.10531.4
Re: OT - CSS Float Image Bottom Right corner of DIV
It was a flippant comment, in response to a flippant comment. Context is cool! ;-) You can call me Denny, btw- although I'm also a person. =] On 11/1/06, Bobby Hartsfield [EMAIL PROTECTED] wrote: Ahh ok sorry. I overlooked the names. SO maybe the person who DID say it can offer an example? I don't really think this falls under the to 'CSS' or to 'Table' debate though. :-) if you can do it in either... id like to see it. -Original Message- From: Josh Nathanson [mailto:[EMAIL PROTECTED] Sent: Wednesday, November 01, 2006 7:20 PM To: CF-Talk Subject: Re: OT - CSS Float Image Bottom Right corner of DIV I said originally it was a hack, and I wasn't the one who said I'd use a table, that was Denny. I just provided an admittedly hack method to achieve the desired result given certain circumstances. But, I would use a table anyway. I can't be stuffed with css layouts most of the time. Call me when someone develops CLS (Cascading Layout Sheets) ;0) -- Josh ~| Introducing the Fusion Authority Quarterly Update. 80 pages of hard-hitting, up-to-date ColdFusion information by your peers, delivered to your door four times a year. http://www.fusionauthority.com/quarterly Archive: http://www.houseoffusion.com/groups/CF-Talk/message.cfm/messageid:258881 Subscription: http://www.houseoffusion.com/groups/CF-Talk/subscribe.cfm Unsubscribe: http://www.houseoffusion.com/cf_lists/unsubscribe.cfm?user=11502.10531.4
RE: OT - CSS Float Image Bottom Right corner of DIV
If I really cared to look up the ORGINAL 'flippant comment' and the person who posted it, I would have called you Denny. But still no example I see. -Original Message- From: Denny Valliant [mailto:[EMAIL PROTECTED] Sent: Thursday, November 02, 2006 2:12 PM To: CF-Talk Subject: Re: OT - CSS Float Image Bottom Right corner of DIV It was a flippant comment, in response to a flippant comment. Context is cool! ;-) You can call me Denny, btw- although I'm also a person. =] On 11/1/06, Bobby Hartsfield [EMAIL PROTECTED] wrote: Ahh ok sorry. I overlooked the names. SO maybe the person who DID say it can offer an example? I don't really think this falls under the to 'CSS' or to 'Table' debate though. :-) if you can do it in either... id like to see it. -Original Message- From: Josh Nathanson [mailto:[EMAIL PROTECTED] Sent: Wednesday, November 01, 2006 7:20 PM To: CF-Talk Subject: Re: OT - CSS Float Image Bottom Right corner of DIV I said originally it was a hack, and I wasn't the one who said I'd use a table, that was Denny. I just provided an admittedly hack method to achieve the desired result given certain circumstances. But, I would use a table anyway. I can't be stuffed with css layouts most of the time. Call me when someone develops CLS (Cascading Layout Sheets) ;0) -- Josh ~| Introducing the Fusion Authority Quarterly Update. 80 pages of hard-hitting, up-to-date ColdFusion information by your peers, delivered to your door four times a year. http://www.fusionauthority.com/quarterly Archive: http://www.houseoffusion.com/groups/CF-Talk/message.cfm/messageid:258949 Subscription: http://www.houseoffusion.com/groups/CF-Talk/subscribe.cfm Unsubscribe: http://www.houseoffusion.com/cf_lists/unsubscribe.cfm?user=89.70.4
Re: OT - CSS Float Image Bottom Right corner of DIV
On 10/31/06, Denny Valliant [EMAIL PROTECTED] wrote: I'd use a table. :-P Thank you all for your assistance. In the end I was attempting to mimic what our Designer put into the layout template but I guess there are times when this just can't happen without much additional overhead. Kinda funny that with all the advancements of the browser it still doesn't understand where a pixel is located on its canvas and allow a developer to code around a paticular square weather it be 30 pixels or 300 Desired effect: xxx xxx xxx +-+ | | | | | | Xxxx +-+ I could find length of a paragraph of text and break that into s separate div for display around the picture but for this project I think Jennifer (designer) won't mind much if I do something else. Thanks again everyone, you're all rock stars in my book! -- Casey ~| Introducing the Fusion Authority Quarterly Update. 80 pages of hard-hitting, up-to-date ColdFusion information by your peers, delivered to your door four times a year. http://www.fusionauthority.com/quarterly Archive: http://www.houseoffusion.com/groups/CF-Talk/message.cfm/messageid:258665 Subscription: http://www.houseoffusion.com/groups/CF-Talk/subscribe.cfm Unsubscribe: http://www.houseoffusion.com/cf_lists/unsubscribe.cfm?user=11502.10531.4
RE: OT - CSS Float Image Bottom Right corner of DIV
Even a table wouldn't give him the result for which he's looking. Assuming you had a 3x3 table, with the image in the bottom right corner, the text still would not be able to wrap around it at the bottom. !//-- andy matthews web developer certified advanced coldfusion programmer ICGLink, Inc. [EMAIL PROTECTED] 615.370.1530 x737 --//- -Original Message- From: Denny Valliant [mailto:[EMAIL PROTECTED] Sent: Tuesday, October 31, 2006 10:11 PM To: CF-Talk Subject: Re: OT - CSS Float Image Bottom Right corner of DIV On 10/31/06, Mark Henderson [EMAIL PROTECTED] wrote: . Maybe I got a little carried away up there. Who knows. Denny, what do you think?? J/k!! I'd use a table. :-P Loved the ascii art, BTW! =D3 ~| Introducing the Fusion Authority Quarterly Update. 80 pages of hard-hitting, up-to-date ColdFusion information by your peers, delivered to your door four times a year. http://www.fusionauthority.com/quarterly Archive: http://www.houseoffusion.com/groups/CF-Talk/message.cfm/messageid:258681 Subscription: http://www.houseoffusion.com/groups/CF-Talk/subscribe.cfm Unsubscribe: http://www.houseoffusion.com/cf_lists/unsubscribe.cfm?user=89.70.4
RE: OT - CSS Float Image Bottom Right corner of DIV
I'd use a table. :-P How so? -- No virus found in this outgoing message. Checked by AVG Free Edition. Version: 7.5.430 / Virus Database: 268.13.21/511 - Release Date: 11/1/2006 9:40 AM ~| Introducing the Fusion Authority Quarterly Update. 80 pages of hard-hitting, up-to-date ColdFusion information by your peers, delivered to your door four times a year. http://www.fusionauthority.com/quarterly Archive: http://www.houseoffusion.com/groups/CF-Talk/message.cfm/messageid:258723 Subscription: http://www.houseoffusion.com/groups/CF-Talk/subscribe.cfm Unsubscribe: http://www.houseoffusion.com/cf_lists/unsubscribe.cfm?user=11502.10531.4
RE: OT - CSS Float Image Bottom Right corner of DIV
On Wednesday at 5:15pm Denny Valliant wrote I'd use a table. :-P See, that's what I'm talking about, and as soon as I hit send I knew there'd be mention of a table in there somewhere! Too cute :-) -- This message has been scanned for viruses and dangerous content by ISPNZ's automated virus detection system, and is believed to be clean. ~| Introducing the Fusion Authority Quarterly Update. 80 pages of hard-hitting, up-to-date ColdFusion information by your peers, delivered to your door four times a year. http://www.fusionauthority.com/quarterly Archive: http://www.houseoffusion.com/groups/CF-Talk/message.cfm/messageid:258732 Subscription: http://www.houseoffusion.com/groups/CF-Talk/subscribe.cfm Unsubscribe: http://www.houseoffusion.com/cf_lists/unsubscribe.cfm?user=89.70.4
Re: OT - CSS Float Image Bottom Right corner of DIV
You have to do a table within a table, and hack a little, but it's a lot easier than with a div. http://www.oakcitygraphics.com/image_align_right_bottom.html -- Josh - Original Message - From: Bobby Hartsfield [EMAIL PROTECTED] To: CF-Talk cf-talk@houseoffusion.com Sent: Wednesday, November 01, 2006 11:20 AM Subject: RE: OT - CSS Float Image Bottom Right corner of DIV I'd use a table. :-P How so? -- No virus found in this outgoing message. Checked by AVG Free Edition. Version: 7.5.430 / Virus Database: 268.13.21/511 - Release Date: 11/1/2006 9:40 AM ~| Introducing the Fusion Authority Quarterly Update. 80 pages of hard-hitting, up-to-date ColdFusion information by your peers, delivered to your door four times a year. http://www.fusionauthority.com/quarterly Archive: http://www.houseoffusion.com/groups/CF-Talk/message.cfm/messageid:258733 Subscription: http://www.houseoffusion.com/groups/CF-Talk/subscribe.cfm Unsubscribe: http://www.houseoffusion.com/cf_lists/unsubscribe.cfm?user=89.70.4
Re: OT - CSS Float Image Bottom Right corner of DIV
Caveat: It's not a true float as you have to fix the width of the outer table. But, if you can do that you can achieve the desired effect. Not sure if this is easier than doing the same thing with a div or not. -- Josh - Original Message - From: Josh Nathanson [EMAIL PROTECTED] To: CF-Talk cf-talk@houseoffusion.com Sent: Wednesday, November 01, 2006 11:41 AM Subject: Re: OT - CSS Float Image Bottom Right corner of DIV You have to do a table within a table, and hack a little, but it's a lot easier than with a div. http://www.oakcitygraphics.com/image_align_right_bottom.html -- Josh - Original Message - From: Bobby Hartsfield [EMAIL PROTECTED] To: CF-Talk cf-talk@houseoffusion.com Sent: Wednesday, November 01, 2006 11:20 AM Subject: RE: OT - CSS Float Image Bottom Right corner of DIV I'd use a table. :-P How so? -- No virus found in this outgoing message. Checked by AVG Free Edition. Version: 7.5.430 / Virus Database: 268.13.21/511 - Release Date: 11/1/2006 9:40 AM ~| Introducing the Fusion Authority Quarterly Update. 80 pages of hard-hitting, up-to-date ColdFusion information by your peers, delivered to your door four times a year. http://www.fusionauthority.com/quarterly Archive: http://www.houseoffusion.com/groups/CF-Talk/message.cfm/messageid:258737 Subscription: http://www.houseoffusion.com/groups/CF-Talk/subscribe.cfm Unsubscribe: http://www.houseoffusion.com/cf_lists/unsubscribe.cfm?user=11502.10531.4
RE: OT - CSS Float Image Bottom Right corner of DIV
You have to do a table within a table, and hack a little, but it's a lot easier than with a div. http://www.oakcitygraphics.com/image_align_right_bottom.html Thats a horrible hack... especially the actual placement of the bottom right table needing to be scrupulously placed into the text at a position that makes it look the best. How would you do that dynamically without knowing how much text will be displayed or how big an image might be in the bottom right table? Counting characters is out with non-fixed fonts... not to mention the obvious issues of having another taller column left or right of the main column... You may as well just float a background bottom right and used BR tags to keep text off of it. It doesnt work dynamically either but it wouldnt use tables just as bad of an idea. Sorry, but I just assumed you had a sure fire method with tables since you so boldly stated, I'd use a table and left it at that. I've always wished (I'm sure I'm not alone) that float had a vertical set to go with the horizontal (like background or background-image does) but without it, I think you have yourself a genuine problem with dynamic data. I thought about using JS to position it and have the text wrap and luckily I found an example without having to write it :-) It uses another image to push the other down. You could make the 'pusher' image a transparent pixel gif easily. http://www.xs4all.nl/~jer03n/sandbox/float-bottom-right.html although, it's another method I wouldnt use unless it was ok for the image to float top right when JS is disabled. I'm not sure if thats acceptable in your case but it is 'table-less'. ..:.:.:.:.:.:.:.:.:.:.:. Bobby Hartsfield http://acoderslife.com -- No virus found in this outgoing message. Checked by AVG Free Edition. Version: 7.5.430 / Virus Database: 268.13.21/511 - Release Date: 11/1/2006 9:40 AM ~| Introducing the Fusion Authority Quarterly Update. 80 pages of hard-hitting, up-to-date ColdFusion information by your peers, delivered to your door four times a year. http://www.fusionauthority.com/quarterly Archive: http://www.houseoffusion.com/groups/CF-Talk/message.cfm/messageid:258774 Subscription: http://www.houseoffusion.com/groups/CF-Talk/subscribe.cfm Unsubscribe: http://www.houseoffusion.com/cf_lists/unsubscribe.cfm?user=89.70.4
Re: OT - CSS Float Image Bottom Right corner of DIV
I said originally it was a hack, and I wasn't the one who said I'd use a table, that was Denny. I just provided an admittedly hack method to achieve the desired result given certain circumstances. But, I would use a table anyway. I can't be stuffed with css layouts most of the time. Call me when someone develops CLS (Cascading Layout Sheets) ;0) -- Josh - Original Message - From: Bobby Hartsfield [EMAIL PROTECTED] To: CF-Talk cf-talk@houseoffusion.com Sent: Wednesday, November 01, 2006 3:34 PM Subject: RE: OT - CSS Float Image Bottom Right corner of DIV You have to do a table within a table, and hack a little, but it's a lot easier than with a div. http://www.oakcitygraphics.com/image_align_right_bottom.html That's a horrible hack... especially the actual placement of the bottom right table needing to be scrupulously placed into the text at a position that makes it look the best. How would you do that dynamically without knowing how much text will be displayed or how big an image might be in the bottom right table? Counting characters is out with non-fixed fonts... not to mention the obvious issues of having another taller column left or right of the main column... You may as well just float a background bottom right and used BR tags to keep text off of it. It doesn't work dynamically either but it wouldn't use tables just as bad of an idea. Sorry, but I just assumed you had a sure fire method with tables since you so boldly stated, I'd use a table and left it at that. I've always wished (I'm sure I'm not alone) that float had a vertical set to go with the horizontal (like background or background-image does) but without it, I think you have yourself a genuine problem with dynamic data. I thought about using JS to position it and have the text wrap and luckily I found an example without having to write it :-) It uses another image to push the other down. You could make the 'pusher' image a transparent pixel gif easily. http://www.xs4all.nl/~jer03n/sandbox/float-bottom-right.html although, it's another method I wouldn't use unless it was ok for the image to float top right when JS is disabled. I'm not sure if that's acceptable in your case but it is 'table-less'. ..:.:.:.:.:.:.:.:.:.:.:. Bobby Hartsfield http://acoderslife.com -- No virus found in this outgoing message. Checked by AVG Free Edition. Version: 7.5.430 / Virus Database: 268.13.21/511 - Release Date: 11/1/2006 9:40 AM ~| Introducing the Fusion Authority Quarterly Update. 80 pages of hard-hitting, up-to-date ColdFusion information by your peers, delivered to your door four times a year. http://www.fusionauthority.com/quarterly Archive: http://www.houseoffusion.com/groups/CF-Talk/message.cfm/messageid:258789 Subscription: http://www.houseoffusion.com/groups/CF-Talk/subscribe.cfm Unsubscribe: http://www.houseoffusion.com/cf_lists/unsubscribe.cfm?user=89.70.4
RE: OT - CSS Float Image Bottom Right corner of DIV
Ahh ok sorry. I overlooked the names. SO maybe the person who DID say it can offer an example? I dont really think this falls under the to 'CSS' or to 'Table' debate though. :-) if you can do it in either... id like to see it. -Original Message- From: Josh Nathanson [mailto:[EMAIL PROTECTED] Sent: Wednesday, November 01, 2006 7:20 PM To: CF-Talk Subject: Re: OT - CSS Float Image Bottom Right corner of DIV I said originally it was a hack, and I wasn't the one who said I'd use a table, that was Denny. I just provided an admittedly hack method to achieve the desired result given certain circumstances. But, I would use a table anyway. I can't be stuffed with css layouts most of the time. Call me when someone develops CLS (Cascading Layout Sheets) ;0) -- Josh - Original Message - From: Bobby Hartsfield [EMAIL PROTECTED] To: CF-Talk cf-talk@houseoffusion.com Sent: Wednesday, November 01, 2006 3:34 PM Subject: RE: OT - CSS Float Image Bottom Right corner of DIV You have to do a table within a table, and hack a little, but it's a lot easier than with a div. http://www.oakcitygraphics.com/image_align_right_bottom.html That's a horrible hack... especially the actual placement of the bottom right table needing to be scrupulously placed into the text at a position that makes it look the best. How would you do that dynamically without knowing how much text will be displayed or how big an image might be in the bottom right table? Counting characters is out with non-fixed fonts... not to mention the obvious issues of having another taller column left or right of the main column... You may as well just float a background bottom right and used BR tags to keep text off of it. It doesn't work dynamically either but it wouldn't use tables just as bad of an idea. Sorry, but I just assumed you had a sure fire method with tables since you so boldly stated, I'd use a table and left it at that. I've always wished (I'm sure I'm not alone) that float had a vertical set to go with the horizontal (like background or background-image does) but without it, I think you have yourself a genuine problem with dynamic data. I thought about using JS to position it and have the text wrap and luckily I found an example without having to write it :-) It uses another image to push the other down. You could make the 'pusher' image a transparent pixel gif easily. http://www.xs4all.nl/~jer03n/sandbox/float-bottom-right.html although, it's another method I wouldn't use unless it was ok for the image to float top right when JS is disabled. I'm not sure if that's acceptable in your case but it is 'table-less'. ..:.:.:.:.:.:.:.:.:.:.:. Bobby Hartsfield http://acoderslife.com -- No virus found in this outgoing message. Checked by AVG Free Edition. Version: 7.5.430 / Virus Database: 268.13.21/511 - Release Date: 11/1/2006 9:40 AM ~| Introducing the Fusion Authority Quarterly Update. 80 pages of hard-hitting, up-to-date ColdFusion information by your peers, delivered to your door four times a year. http://www.fusionauthority.com/quarterly Archive: http://www.houseoffusion.com/groups/CF-Talk/message.cfm/messageid:258800 Subscription: http://www.houseoffusion.com/groups/CF-Talk/subscribe.cfm Unsubscribe: http://www.houseoffusion.com/cf_lists/unsubscribe.cfm?user=11502.10531.4
OT - CSS Float Image Bottom Right corner of DIV
I've been looking all around and maybe it's the 1/2 cup of java that's slowing me down but I can't seem to find any CSS resources that show a person placing an image on the bottom right of a div . Text would wrap above and to the left of the image. Anyone got a pointer for me... Thank you, -- Casey ~| Introducing the Fusion Authority Quarterly Update. 80 pages of hard-hitting, up-to-date ColdFusion information by your peers, delivered to your door four times a year. http://www.fusionauthority.com/quarterly Archive: http://www.houseoffusion.com/groups/CF-Talk/message.cfm/messageid:258525 Subscription: http://www.houseoffusion.com/groups/CF-Talk/subscribe.cfm Unsubscribe: http://www.houseoffusion.com/cf_lists/unsubscribe.cfm?user=11502.10531.4
Re: OT - CSS Float Image Bottom Right corner of DIV
That'll be because you float to the left or the right - there's no facility to float up or down. If you want an image placed in the bottom right, you can set the containers style to be background: url(imagename) no-repeat bottom right; padding-bottom: 100px; (where 100px is the height of the image.) or position: absolute; bottom: 0px; right: 0px on the image itself (with only the padding on the container) Neither of those will wrap text around the image, but will prevent it from overlapping. The I can't think of any actual wrapping bottom right methods right now, but there might be a way to do it with JavaScript. On 10/31/06, Doug Brown [EMAIL PROTECTED] wrote: Here is a link to check out http://codex.wordpress.org/Wrapping_Text_Around_Images Yeah I checked it out but, I don't see anything in there about floating image bottom right. ~| Introducing the Fusion Authority Quarterly Update. 80 pages of hard-hitting, up-to-date ColdFusion information by your peers, delivered to your door four times a year. http://www.fusionauthority.com/quarterly Archive: http://www.houseoffusion.com/groups/CF-Talk/message.cfm/messageid:258531 Subscription: http://www.houseoffusion.com/groups/CF-Talk/subscribe.cfm Unsubscribe: http://www.houseoffusion.com/cf_lists/unsubscribe.cfm?user=11502.10531.4
RE: OT - CSS Float Image Bottom Right corner of DIV
Rules of floating (there are 9 of them), basically says that an object being floated will always tend as far toward the side it is floated to (left or right) and as far up as it can given the constraints of the rules. Try floating the image on the top right of a div beneath this particular div instead. Sandra Clark == http://www.shayna.com Training in Cascading Style Sheets and Accessibility -Original Message- From: Casey Dougall [mailto:[EMAIL PROTECTED] Sent: Tuesday, October 31, 2006 8:13 AM To: CF-Talk Subject: Re: OT - CSS Float Image Bottom Right corner of DIV On 10/31/06, Doug Brown [EMAIL PROTECTED] wrote: Here is a link to check out http://codex.wordpress.org/Wrapping_Text_Around_Images Yeah I checked it out but, I don't see anything in there about floating image bottom right. ~| Introducing the Fusion Authority Quarterly Update. 80 pages of hard-hitting, up-to-date ColdFusion information by your peers, delivered to your door four times a year. http://www.fusionauthority.com/quarterly Archive: http://www.houseoffusion.com/groups/CF-Talk/message.cfm/messageid:258532 Subscription: http://www.houseoffusion.com/groups/CF-Talk/subscribe.cfm Unsubscribe: http://www.houseoffusion.com/cf_lists/unsubscribe.cfm?user=89.70.4
RE: OT - CSS Float Image Bottom Right corner of DIV
Sandy, you've mentioned these CSS rules a couple of times the past few weeks. Is there a place where all these rules reside in one place? Wasn't there like 72 of them or something? Ray -Original Message- From: Sandra Clark [mailto:[EMAIL PROTECTED] Sent: Tuesday, October 31, 2006 8:38 AM To: CF-Talk Subject: RE: OT - CSS Float Image Bottom Right corner of DIV Rules of floating (there are 9 of them), basically says that an object being floated will always tend as far toward the side it is floated to (left or right) and as far up as it can given the constraints of the rules. Try floating the image on the top right of a div beneath this particular div instead. Sandra Clark == http://www.shayna.com Training in Cascading Style Sheets and Accessibility -Original Message- From: Casey Dougall [mailto:[EMAIL PROTECTED] Sent: Tuesday, October 31, 2006 8:13 AM To: CF-Talk Subject: Re: OT - CSS Float Image Bottom Right corner of DIV On 10/31/06, Doug Brown [EMAIL PROTECTED] wrote: Here is a link to check out http://codex.wordpress.org/Wrapping_Text_Around_Images Yeah I checked it out but, I don't see anything in there about floating image bottom right. ~| Introducing the Fusion Authority Quarterly Update. 80 pages of hard-hitting, up-to-date ColdFusion information by your peers, delivered to your door four times a year. http://www.fusionauthority.com/quarterly Archive: http://www.houseoffusion.com/groups/CF-Talk/message.cfm/messageid:258534 Subscription: http://www.houseoffusion.com/groups/CF-Talk/subscribe.cfm Unsubscribe: http://www.houseoffusion.com/cf_lists/unsubscribe.cfm?user=89.70.4
Re: OT - CSS Float Image Bottom Right corner of DIV
PS... If you click on the link and it ads a 80: in the url, remove it and reload. Must be a CFTALK thing. - Original Message - From: Doug Brown [EMAIL PROTECTED] To: CF-Talk cf-talk@houseoffusion.com Sent: Tuesday, October 31, 2006 6:00 AM Subject: Re: OT - CSS Float Image Bottom Right corner of DIV Here is a link to check out http://codex.wordpress.org/Wrapping_Text_Around_Images - Original Message - From: Casey Dougall [EMAIL PROTECTED] To: CF-Talk cf-talk@houseoffusion.com Sent: Tuesday, October 31, 2006 5:24 AM Subject: OT - CSS Float Image Bottom Right corner of DIV I've been looking all around and maybe it's the 1/2 cup of java that's slowing me down but I can't seem to find any CSS resources that show a person placing an image on the bottom right of a div . Text would wrap above and to the left of the image. Anyone got a pointer for me... Thank you, -- Casey ~| Introducing the Fusion Authority Quarterly Update. 80 pages of hard-hitting, up-to-date ColdFusion information by your peers, delivered to your door four times a year. http://www.fusionauthority.com/quarterly Archive: http://www.houseoffusion.com/groups/CF-Talk/message.cfm/messageid:258528 Subscription: http://www.houseoffusion.com/groups/CF-Talk/subscribe.cfm Unsubscribe: http://www.houseoffusion.com/cf_lists/unsubscribe.cfm?user=11502.10531.4
Re: OT - CSS Float Image Bottom Right corner of DIV
Here is a link to check out http://codex.wordpress.org/Wrapping_Text_Around_Images - Original Message - From: Casey Dougall [EMAIL PROTECTED] To: CF-Talk cf-talk@houseoffusion.com Sent: Tuesday, October 31, 2006 5:24 AM Subject: OT - CSS Float Image Bottom Right corner of DIV I've been looking all around and maybe it's the 1/2 cup of java that's slowing me down but I can't seem to find any CSS resources that show a person placing an image on the bottom right of a div . Text would wrap above and to the left of the image. Anyone got a pointer for me... Thank you, -- Casey ~| Introducing the Fusion Authority Quarterly Update. 80 pages of hard-hitting, up-to-date ColdFusion information by your peers, delivered to your door four times a year. http://www.fusionauthority.com/quarterly Archive: http://www.houseoffusion.com/groups/CF-Talk/message.cfm/messageid:258527 Subscription: http://www.houseoffusion.com/groups/CF-Talk/subscribe.cfm Unsubscribe: http://www.houseoffusion.com/cf_lists/unsubscribe.cfm?user=89.70.4
RE: OT - CSS Float Image Bottom Right corner of DIV
Looks fine here on FF2.0. -Original Message- From: Casey Dougall [mailto:[EMAIL PROTECTED] Sent: Tuesday, October 31, 2006 9:27 AM To: CF-Talk Subject: Re: OT - CSS Float Image Bottom Right corner of DIV On 10/31/06, Jerry Johnson [EMAIL PROTECTED] wrote: Sure, take her class. Syllabus Positioning via Floats * Description of Floating * Floating Rules * Float Behaviors * Clearing a Float http://www.shayna.com/index.cfm?fuseaction=training.syllabus_displayid=3 Bwahhhaahhhaaahhaa! Fix the class information prices so they line up correctly on Firefox and I might think about it. ;-) Just kidding Sandra, you provide lots of good tips. just an FYI it's F#$% up on firefox. Un-bolded text show up way to the left and a line under the bold text. ~| Introducing the Fusion Authority Quarterly Update. 80 pages of hard-hitting, up-to-date ColdFusion information by your peers, delivered to your door four times a year. http://www.fusionauthority.com/quarterly Archive: http://www.houseoffusion.com/groups/CF-Talk/message.cfm/messageid:258541 Subscription: http://www.houseoffusion.com/groups/CF-Talk/subscribe.cfm Unsubscribe: http://www.houseoffusion.com/cf_lists/unsubscribe.cfm?user=89.70.4
RE: OT - CSS Float Image Bottom Right corner of DIV
Me too. Someday, hopefully, when I convert this place from table-based layouts to CSS. :) Who knows, it might be closer than I think, we're light-years closer than we were a year ago... -Original Message- From: Jerry Johnson [mailto:[EMAIL PROTECTED] Sent: Tuesday, October 31, 2006 8:52 AM To: CF-Talk Subject: Re: OT - CSS Float Image Bottom Right corner of DIV Importance: High Sure, take her class. Syllabus Positioning via Floats * Description of Floating * Floating Rules * Float Behaviors * Clearing a Float http://www.shayna.com/index.cfm?fuseaction=training.syllabus_displayid=3 Bwahhhaahhhaaahhaa! (I wish I could take her class.) On 10/31/06, Ray Champagne [EMAIL PROTECTED] wrote: Sandy, you've mentioned these CSS rules a couple of times the past few weeks. Is there a place where all these rules reside in one place? Wasn't there like 72 of them or something? ~| Introducing the Fusion Authority Quarterly Update. 80 pages of hard-hitting, up-to-date ColdFusion information by your peers, delivered to your door four times a year. http://www.fusionauthority.com/quarterly Archive: http://www.houseoffusion.com/groups/CF-Talk/message.cfm/messageid:258540 Subscription: http://www.houseoffusion.com/groups/CF-Talk/subscribe.cfm Unsubscribe: http://www.houseoffusion.com/cf_lists/unsubscribe.cfm?user=11502.10531.4
RE: OT - CSS Float Image Bottom Right corner of DIV
Found it, it was dying at 1024 x 768. I'm uploading a fix for the dl now. Should be up in around 5 minutes. Thanks for the heads up! Sandra Clark == http://www.shayna.com Training in Cascading Style Sheets and Accessibility -Original Message- From: Sandra Clark [mailto:[EMAIL PROTECTED] Sent: Tuesday, October 31, 2006 9:39 AM To: CF-Talk Subject: RE: OT - CSS Float Image Bottom Right corner of DIV What version and OS? I'm looking at it on FF2.0 and it looks fine (also looks fine on FF 1.5) both Win XP Sp2. Send me a screen shot with the information? If there is enough interest, I'll put a class together, I need at least 6 people to hold a class and make it worth my while (covering rental costs and time off from my regular job without pay). I'm re-thinking my classes, might go the WBT route instead and price it by module. But that won't be for a while, I'm swamped right now. Sandra Clark == http://www.shayna.com Training in Cascading Style Sheets and Accessibility -Original Message- From: Casey Dougall [mailto:[EMAIL PROTECTED] Sent: Tuesday, October 31, 2006 9:27 AM To: CF-Talk Subject: Re: OT - CSS Float Image Bottom Right corner of DIV On 10/31/06, Jerry Johnson [EMAIL PROTECTED] wrote: Sure, take her class. Syllabus Positioning via Floats * Description of Floating * Floating Rules * Float Behaviors * Clearing a Float http://www.shayna.com/index.cfm?fuseaction=training.syllabus_displayi d=3 Bwahhhaahhhaaahhaa! Fix the class information prices so they line up correctly on Firefox and I might think about it. ;-) Just kidding Sandra, you provide lots of good tips. just an FYI it's F#$% up on firefox. Un-bolded text show up way to the left and a line under the bold text. ~| Introducing the Fusion Authority Quarterly Update. 80 pages of hard-hitting, up-to-date ColdFusion information by your peers, delivered to your door four times a year. http://www.fusionauthority.com/quarterly Archive: http://www.houseoffusion.com/groups/CF-Talk/message.cfm/messageid:258543 Subscription: http://www.houseoffusion.com/groups/CF-Talk/subscribe.cfm Unsubscribe: http://www.houseoffusion.com/cf_lists/unsubscribe.cfm?user=11502.10531.4
Re: OT - CSS Float Image Bottom Right corner of DIV
On 10/31/06, Doug Brown [EMAIL PROTECTED] wrote: Here is a link to check out http://codex.wordpress.org/Wrapping_Text_Around_Images Yeah I checked it out but, I don't see anything in there about floating image bottom right. ~| Introducing the Fusion Authority Quarterly Update. 80 pages of hard-hitting, up-to-date ColdFusion information by your peers, delivered to your door four times a year. http://www.fusionauthority.com/quarterly Archive: http://www.houseoffusion.com/groups/CF-Talk/message.cfm/messageid:258530 Subscription: http://www.houseoffusion.com/groups/CF-Talk/subscribe.cfm Unsubscribe: http://www.houseoffusion.com/cf_lists/unsubscribe.cfm?user=11502.10531.4
Re: OT - CSS Float Image Bottom Right corner of DIV
On 10/31/06, Sandra Clark [EMAIL PROTECTED] wrote: Found it, it was dying at 1024 x 768. I'm uploading a fix for the dl now. Should be up in around 5 minutes. Yeah, working from home today only 16 inch monitors (yuck) Casey ~| Introducing the Fusion Authority Quarterly Update. 80 pages of hard-hitting, up-to-date ColdFusion information by your peers, delivered to your door four times a year. http://www.fusionauthority.com/quarterly Archive: http://www.houseoffusion.com/groups/CF-Talk/message.cfm/messageid:258547 Subscription: http://www.houseoffusion.com/groups/CF-Talk/subscribe.cfm Unsubscribe: http://www.houseoffusion.com/cf_lists/unsubscribe.cfm?user=11502.10531.4
Re: OT - CSS Float Image Bottom Right corner of DIV
On 10/31/06, Jerry Johnson [EMAIL PROTECTED] wrote: Sure, take her class. Syllabus Positioning via Floats * Description of Floating * Floating Rules * Float Behaviors * Clearing a Float http://www.shayna.com/index.cfm?fuseaction=training.syllabus_displayid=3 Bwahhhaahhhaaahhaa! Fix the class information prices so they line up correctly on Firefox and I might think about it. ;-) Just kidding Sandra, you provide lots of good tips. just an FYI it's F#$% up on firefox. Un-bolded text show up way to the left and a line under the bold text. ~| Introducing the Fusion Authority Quarterly Update. 80 pages of hard-hitting, up-to-date ColdFusion information by your peers, delivered to your door four times a year. http://www.fusionauthority.com/quarterly Archive: http://www.houseoffusion.com/groups/CF-Talk/message.cfm/messageid:258538 Subscription: http://www.houseoffusion.com/groups/CF-Talk/subscribe.cfm Unsubscribe: http://www.houseoffusion.com/cf_lists/unsubscribe.cfm?user=11502.10531.4
RE: OT - CSS Float Image Bottom Right corner of DIV
What version and OS? I'm looking at it on FF2.0 and it looks fine (also looks fine on FF 1.5) both Win XP Sp2. Send me a screen shot with the information? If there is enough interest, I'll put a class together, I need at least 6 people to hold a class and make it worth my while (covering rental costs and time off from my regular job without pay). I'm re-thinking my classes, might go the WBT route instead and price it by module. But that won't be for a while, I'm swamped right now. Sandra Clark == http://www.shayna.com Training in Cascading Style Sheets and Accessibility -Original Message- From: Casey Dougall [mailto:[EMAIL PROTECTED] Sent: Tuesday, October 31, 2006 9:27 AM To: CF-Talk Subject: Re: OT - CSS Float Image Bottom Right corner of DIV On 10/31/06, Jerry Johnson [EMAIL PROTECTED] wrote: Sure, take her class. Syllabus Positioning via Floats * Description of Floating * Floating Rules * Float Behaviors * Clearing a Float http://www.shayna.com/index.cfm?fuseaction=training.syllabus_displayi d=3 Bwahhhaahhhaaahhaa! Fix the class information prices so they line up correctly on Firefox and I might think about it. ;-) Just kidding Sandra, you provide lots of good tips. just an FYI it's F#$% up on firefox. Un-bolded text show up way to the left and a line under the bold text. ~| Introducing the Fusion Authority Quarterly Update. 80 pages of hard-hitting, up-to-date ColdFusion information by your peers, delivered to your door four times a year. http://www.fusionauthority.com/quarterly Archive: http://www.houseoffusion.com/groups/CF-Talk/message.cfm/messageid:258542 Subscription: http://www.houseoffusion.com/groups/CF-Talk/subscribe.cfm Unsubscribe: http://www.houseoffusion.com/cf_lists/unsubscribe.cfm?user=89.70.4
Re: OT - CSS Float Image Bottom Right corner of DIV
Sure, take her class. Syllabus Positioning via Floats * Description of Floating * Floating Rules * Float Behaviors * Clearing a Float http://www.shayna.com/index.cfm?fuseaction=training.syllabus_displayid=3 Bwahhhaahhhaaahhaa! (I wish I could take her class.) On 10/31/06, Ray Champagne [EMAIL PROTECTED] wrote: Sandy, you've mentioned these CSS rules a couple of times the past few weeks. Is there a place where all these rules reside in one place? Wasn't there like 72 of them or something? ~| Introducing the Fusion Authority Quarterly Update. 80 pages of hard-hitting, up-to-date ColdFusion information by your peers, delivered to your door four times a year. http://www.fusionauthority.com/quarterly Archive: http://www.houseoffusion.com/groups/CF-Talk/message.cfm/messageid:258536 Subscription: http://www.houseoffusion.com/groups/CF-Talk/subscribe.cfm Unsubscribe: http://www.houseoffusion.com/cf_lists/unsubscribe.cfm?user=89.70.4
RE: OT - CSS Float Image Bottom Right corner of DIV
Casey Dougall wrote I've been looking all around and maybe it's the 1/2 cup of java that's slowing me down but I can't seem to find any CSS resources that show a person placing an image on the bottom right of a div . Text would wrap above and to the left of the image. Then Sandra Clark wrote: Try floating the image on the top right of a div beneath this particular div instead. Unfortunately that's not going to solve Casey's problem in this case, since doing that will still only result in the image (aligned right) but directly below all the text in the above div, which, unless I'm mistaken is not the desired effect. Please excuse the following ASCII art. I assure you I'm better with a pencil or a paint brush! Desired effect: xxx xxx xxx +-+ | | | | | | Xxxx +-+ Image floated below in same OR separate div: xxx xxx xxx ++ | | | | ++ CSS doesn't really offer a solution for this I'm afraid. But that doesn't help much, does it? However, it *can* be done, but it's messy, far from ideal, and whether or not it should be is another question entirely: http://mrclay.org/web_design/bottom_float.php Just an FYI, but generally when this kind of positioning is required (bottom left or bottom right with respect to its ancestor, or a variant of), it is better to relatively position a container, and then absolutely position the child. An example: The CSS #container {position: relative; width: 400px; height: 125px;} #copyright {position: absolute; right: 10px; bottom: 10px;} The HTML div id=container div id=copyright copy; Casey Dougall 2006 div div Caveat: this is best used for laying out certain elements on a page like part of a footer (not to be confused with the layout itself, since absolute positioning should be avoided in almost all layout instances). And again, this wont work in your situation since you require text to interact (wrap) with the image in question. Maybe I got a little carried away up there. Who knows. Denny, what do you think?? J/k!! HTH Mark -- This message has been scanned for viruses and dangerous content by ISPNZ's automated virus detection system, and is believed to be clean. ~| Introducing the Fusion Authority Quarterly Update. 80 pages of hard-hitting, up-to-date ColdFusion information by your peers, delivered to your door four times a year. http://www.fusionauthority.com/quarterly Archive: http://www.houseoffusion.com/groups/CF-Talk/message.cfm/messageid:258649 Subscription: http://www.houseoffusion.com/groups/CF-Talk/subscribe.cfm Unsubscribe: http://www.houseoffusion.com/cf_lists/unsubscribe.cfm?user=11502.10531.4
Re: OT - CSS Float Image Bottom Right corner of DIV
On 10/31/06, Mark Henderson [EMAIL PROTECTED] wrote: Maybe I got a little carried away up there. Who knows. Denny, what do you think?? J/k!! I'd use a table. :-P Loved the ascii art, BTW! =D3 ~| Introducing the Fusion Authority Quarterly Update. 80 pages of hard-hitting, up-to-date ColdFusion information by your peers, delivered to your door four times a year. http://www.fusionauthority.com/quarterly Archive: http://www.houseoffusion.com/groups/CF-Talk/message.cfm/messageid:258652 Subscription: http://www.houseoffusion.com/groups/CF-Talk/subscribe.cfm Unsubscribe: http://www.houseoffusion.com/cf_lists/unsubscribe.cfm?user=89.70.4
OT: CSS UL?
Okay for all the CSS gurus: How can I make a UL tag use less spacing overhead. When you use a UL tag, it creates a good size space in between the previous line to the First LI element. How can I reduce that? I tried: UL style=padding-top:-10px; but did not work (did not think it would but tried). Does it have to be used in conjunction with positioning such as position:relative ? TIA! ~| Introducing the Fusion Authority Quarterly Update. 80 pages of hard-hitting, up-to-date ColdFusion information by your peers, delivered to your door four times a year. http://www.fusionauthority.com/quarterly Archive: http://www.houseoffusion.com/groups/CF-Talk/message.cfm/messageid:256284 Subscription: http://www.houseoffusion.com/groups/CF-Talk/subscribe.cfm Unsubscribe: http://www.houseoffusion.com/cf_lists/unsubscribe.cfm?user=11502.10531.4
Re: OT: CSS UL?
On 10/11/06, Adkins, Randy [EMAIL PROTECTED] wrote: Okay for all the CSS gurus: How can I make a UL tag use less spacing overhead. When you use a UL tag, it creates a good size space in between the previous line to the First LI element. How can I reduce that? margin: 0; That should do it. ~| Introducing the Fusion Authority Quarterly Update. 80 pages of hard-hitting, up-to-date ColdFusion information by your peers, delivered to your door four times a year. http://www.fusionauthority.com/quarterly Archive: http://www.houseoffusion.com/groups/CF-Talk/message.cfm/messageid:256311 Subscription: http://www.houseoffusion.com/groups/CF-Talk/subscribe.cfm Unsubscribe: http://www.houseoffusion.com/cf_lists/unsubscribe.cfm?user=89.70.4
OT: CSS Design
I was wondering if anyone has used CSS entirely on their site to seperate content from presentation. Mainly what I was looking at was the use of images in sites designed using CSS. I was looking around for examples, but could not find any. If anyone has done this on the board, please shoot me a link. Thanks again Doug ~| Introducing the Fusion Authority Quarterly Update. 80 pages of hard-hitting, up-to-date ColdFusion information by your peers, delivered to your door four times a year. http://www.fusionauthority.com/quarterly Archive: http://www.houseoffusion.com/groups/CF-Talk/message.cfm/messageid:255096 Subscription: http://www.houseoffusion.com/groups/CF-Talk/subscribe.cfm Unsubscribe: http://www.houseoffusion.com/cf_lists/unsubscribe.cfm?user=11502.10531.4
OT: CSS
Say I want to apply color on text. I need to do it in the html itself. Here is what I ended up with how can I do it better? The p tag I have no control over. It is there to format the paragraphs. Is there a better tag other then a to apply a style to? pthe following text is the color a style=color:red;red/a/p ~| Introducing the Fusion Authority Quarterly Update. 80 pages of hard-hitting, up-to-date ColdFusion information by your peers, delivered to your door four times a year. http://www.fusionauthority.com/quarterly Archive: http://www.houseoffusion.com/groups/CF-Talk/message.cfm/messageid:249786 Subscription: http://www.houseoffusion.com/groups/CF-Talk/subscribe.cfm Unsubscribe: http://www.houseoffusion.com/cf_lists/unsubscribe.cfm?user=89.70.4
Re: OT: CSS
Yes. Your method will work in a browser, but it's semantically wrong and will give the wrong result for other methods of looking at your page. You should use span for what you want to do. span style=color:red;red/span Cheers Mike Kear Windsor, NSW, Australia Adobe Certified Advanced ColdFusion Developer AFP Webworks http://afpwebworks.com ColdFusion, PHP, ASP, ASP.NET hosting from AUD$15/month On 8/15/06, Chad Gray [EMAIL PROTECTED] wrote: Say I want to apply color on text. I need to do it in the html itself. Here is what I ended up with how can I do it better? The p tag I have no control over. It is there to format the paragraphs. Is there a better tag other then a to apply a style to? pthe following text is the color a style=color:red;red/a/p ~| Introducing the Fusion Authority Quarterly Update. 80 pages of hard-hitting, up-to-date ColdFusion information by your peers, delivered to your door four times a year. http://www.fusionauthority.com/quarterly Archive: http://www.houseoffusion.com/groups/CF-Talk/message.cfm/messageid:249788 Subscription: http://www.houseoffusion.com/groups/CF-Talk/subscribe.cfm Unsubscribe: http://www.houseoffusion.com/cf_lists/unsubscribe.cfm?user=89.70.4
Re: OT: CSS
In line:span style=color:red;red/span Block element (creates a line break unless overridden in the styles) div style=color:red;red/div On 8/14/06, Chad Gray [EMAIL PROTECTED] wrote: Say I want to apply color on text. I need to do it in the html itself. Here is what I ended up with how can I do it better? The p tag I have no control over. It is there to format the paragraphs. Is there a better tag other then a to apply a style to? pthe following text is the color a style=color:red;red/a/p ~| Introducing the Fusion Authority Quarterly Update. 80 pages of hard-hitting, up-to-date ColdFusion information by your peers, delivered to your door four times a year. http://www.fusionauthority.com/quarterly Archive: http://www.houseoffusion.com/groups/CF-Talk/message.cfm/messageid:249791 Subscription: http://www.houseoffusion.com/groups/CF-Talk/subscribe.cfm Unsubscribe: http://www.houseoffusion.com/cf_lists/unsubscribe.cfm?user=11502.10531.4
RE: OT: CSS
Here is a test page using span to change the text to red. Why does it not show up? Because in the style sheet you have span{margin-left:30px;font-size:13px;color:#888;display:none} Hence, it's not displaying anything at all. If you have control of the stylesheet (and I hope you do) you don't need to use inline styles. This will work: pthis is text that i want to turn span style=color:red;display:inlinered/span/p As will removing the display:none from the default span rule but that may have repercussions through other parts of the site. But I would do pthis is text that i want to turn span class=highlightred/span/p or use some other name that better describes what the text you are turning red actually is (don't use red since that's just the color you are changing it to, not it's purpose). Then create the rule for .highlight in your stylesheet. HTH Mark -- This message has been scanned for viruses and dangerous content by ISPNZ's automated virus detection system, and is believed to be clean. ~| Introducing the Fusion Authority Quarterly Update. 80 pages of hard-hitting, up-to-date ColdFusion information by your peers, delivered to your door four times a year. http://www.fusionauthority.com/quarterly Archive: http://www.houseoffusion.com/groups/CF-Talk/message.cfm/messageid:249795 Subscription: http://www.houseoffusion.com/groups/CF-Talk/subscribe.cfm Unsubscribe: http://www.houseoffusion.com/cf_lists/unsubscribe.cfm?user=11502.10531.4
Re: OT: CSS Positioning
On Tuesday 14 February 2006 15:55, Robert Everland III wrote: I want to play around with using CSS instead of using tables to position things. Does anyone have some sites that they use as an example of this that I can go off of. CSS Zen Garden. -- Tom Chiverton Advanced ColdFusion Programmer ~| Message: http://www.houseoffusion.com/lists.cfm/link=i:4:232319 Archives: http://www.houseoffusion.com/cf_lists/threads.cfm/4 Subscription: http://www.houseoffusion.com/lists.cfm/link=s:4 Unsubscribe: http://www.houseoffusion.com/cf_lists/unsubscribe.cfm?user=11502.10531.4 Donations Support: http://www.houseoffusion.com/tiny.cfm/54
OT: CSS Positioning
I want to play around with using CSS instead of using tables to position things. Does anyone have some sites that they use as an example of this that I can go off of. Bob ~| Message: http://www.houseoffusion.com/lists.cfm/link=i:4:232202 Archives: http://www.houseoffusion.com/cf_lists/threads.cfm/4 Subscription: http://www.houseoffusion.com/lists.cfm/link=s:4 Unsubscribe: http://www.houseoffusion.com/cf_lists/unsubscribe.cfm?user=11502.10531.4 Donations Support: http://www.houseoffusion.com/tiny.cfm/54
Re: OT: CSS mystery
Why the ellipses when defining your classes? I've never seen that before. Maybe I'm behind the loop. :) -- Michael Clayton www.twilighted.com ~| Message: http://www.houseoffusion.com/lists.cfm/link=i:4:229448 Archives: http://www.houseoffusion.com/cf_lists/threads.cfm/4 Subscription: http://www.houseoffusion.com/lists.cfm/link=s:4 Unsubscribe: http://www.houseoffusion.com/cf_lists/unsubscribe.cfm?user=89.70.4 Donations Support: http://www.houseoffusion.com/tiny.cfm/54
OT: CSS mystery
Can anyone explain to me why this works in IE 6 and Opera but not in Firefox? !DOCTYPE HTML PUBLIC -//W3C//DTD HTML 4.01 Transitional//EN html head titleUntitled/title /head style .container { color: #00; font-family:tahoma, verdana, helvetica; font-size: 11px; background-color: #f1f1ed; width:170px; height: 100%; border-right: buttonshadow 1px solid; border-top: #f5f5f5 1px solid; border-left: #f5f5f5 1px solid; border-bottom: buttonshadow 1px solid; padding-right : 1px; padding-top : 1px; padding-bottom : 1px; } ...leftMenu { color:#006699; text-decoration:none; font-weight:bold; } ...leftMenu:hover { color:#00; text-decoration:none; font-weight:bold; } ...leftMenu:active { color:#00; text-decoration:none; font-weight:bold ; } ...Menu { width: 100%; height: 20px; padding:2px 5px 3px 2px; border-right: buttonshadow 1px solid; border-top: #f5f5f5 1px solid; border-left: #f5f5f5 1px solid; border-bottom: buttonshadow 1px solid; background-color: #D4D0C8; cursor:hand; color:#00; } ...Option { width: 100%; height: 24px; padding:2 5 3 16; background-color: #f5f5f5; border-top : 1px solid #ff; border-bottom : 1px solid #ff; border-left : 1px solid #ff; border-right : 1px solid #ff; cursor:hand; } ...Options {padding:1 1 1 1} ...imgPosition { vertical-align: middle; } /style body leftmargin=0 topmargin=0 rightmargin=0 bottommargin=0 marginwidth=0 marginheight=0 div class=container div id=parent div class=menu/div /div /div /body /html Bob ~| Message: http://www.houseoffusion.com/lists.cfm/link=i:4:229384 Archives: http://www.houseoffusion.com/cf_lists/threads.cfm/4 Subscription: http://www.houseoffusion.com/lists.cfm/link=s:4 Unsubscribe: http://www.houseoffusion.com/cf_lists/unsubscribe.cfm?user=11502.10531.4 Donations Support: http://www.houseoffusion.com/tiny.cfm/54
Re: OT: CSS mystery
Because IE and Opera are incorrectly ignoring the first two periods, while Firefox is correctly ignoring the rest of the rule? I'm not sure that applies to selectors or just rules, but I'd guess it's for both. Or perhaps its a case-sensitivity issue. CSS is case sensitive, but I believe IE doesn't enforce it. Did you try removing the extra periods or fixing the casing and see if that resolves it? cheers, barneyb On 1/12/06, Robert Everland III [EMAIL PROTECTED] wrote: Can anyone explain to me why this works in IE 6 and Opera but not in Firefox? !DOCTYPE HTML PUBLIC -//W3C//DTD HTML 4.01 Transitional//EN html head titleUntitled/title /head style .container { color: #00; font-family:tahoma, verdana, helvetica; font-size: 11px; background-color: #f1f1ed; width:170px; height: 100%; border-right: buttonshadow 1px solid; border-top: #f5f5f5 1px solid; border-left: #f5f5f5 1px solid; border-bottom: buttonshadow 1px solid; padding-right : 1px; padding-top : 1px; padding-bottom : 1px; } ...leftMenu { color:#006699; text-decoration:none; font-weight:bold; } ...leftMenu:hover { color:#00; text-decoration:none; font-weight:bold; } ...leftMenu:active { color:#00; text-decoration:none; font-weight:bold ; } ...Menu { width: 100%; height: 20px; padding:2px 5px 3px 2px; border-right: buttonshadow 1px solid; border-top: #f5f5f5 1px solid; border-left: #f5f5f5 1px solid; border-bottom: buttonshadow 1px solid; background-color: #D4D0C8; cursor:hand; color:#00; } ...Option { width: 100%; height: 24px; padding:2 5 3 16; background-color: #f5f5f5; border-top : 1px solid #ff; border-bottom : 1px solid #ff; border-left : 1px solid #ff; border-right : 1px solid #ff; cursor:hand; } ...Options {padding:1 1 1 1} ...imgPosition { vertical-align: middle; } /style body leftmargin=0 topmargin=0 rightmargin=0 bottommargin=0 marginwidth=0 marginheight=0 div class=container div id=parent div class=menu/div /div /div /body /html Bob ~| Message: http://www.houseoffusion.com/lists.cfm/link=i:4:229390 Archives: http://www.houseoffusion.com/cf_lists/threads.cfm/4 Subscription: http://www.houseoffusion.com/lists.cfm/link=s:4 Unsubscribe: http://www.houseoffusion.com/cf_lists/unsubscribe.cfm?user=11502.10531.4 Donations Support: http://www.houseoffusion.com/tiny.cfm/54
Re: OT: CSS mystery
It has to do with the way IE and Firefox treat the box model in quirks mode. There's some info about it here: http://www.quirksmode.org/css/quirksmode.html Also, if you remove the width:100% in the menu def, it will fill out correctly. On 1/12/06, Robert Everland III [EMAIL PROTECTED] wrote: Can anyone explain to me why this works in IE 6 and Opera but not in Firefox? !DOCTYPE HTML PUBLIC -//W3C//DTD HTML 4.01 Transitional//EN html head titleUntitled/title /head style .container { color: #00; font-family:tahoma, verdana, helvetica; font-size: 11px; background-color: #f1f1ed; width:170px; height: 100%; border-right: buttonshadow 1px solid; border-top: #f5f5f5 1px solid; border-left: #f5f5f5 1px solid; border-bottom: buttonshadow 1px solid; padding-right : 1px; padding-top : 1px; padding-bottom : 1px; } ...leftMenu { color:#006699; text-decoration:none; font-weight:bold; } ...leftMenu:hover { color:#00; text-decoration:none; font-weight:bold; } ...leftMenu:active { color:#00; text-decoration:none; font-weight:bold ; } ...Menu { width: 100%; height: 20px; padding:2px 5px 3px 2px; border-right: buttonshadow 1px solid; border-top: #f5f5f5 1px solid; border-left: #f5f5f5 1px solid; border-bottom: buttonshadow 1px solid; background-color: #D4D0C8; cursor:hand; color:#00; } ...Option { width: 100%; height: 24px; padding:2 5 3 16; background-color: #f5f5f5; border-top : 1px solid #ff; border-bottom : 1px solid #ff; border-left : 1px solid #ff; border-right : 1px solid #ff; cursor:hand; } ...Options {padding:1 1 1 1} ...imgPosition { vertical-align: middle; } /style body leftmargin=0 topmargin=0 rightmargin=0 bottommargin=0 marginwidth=0 marginheight=0 div class=container div id=parent div class=menu/div /div /div /body /html Bob ~| Message: http://www.houseoffusion.com/lists.cfm/link=i:4:229391 Archives: http://www.houseoffusion.com/cf_lists/threads.cfm/4 Subscription: http://www.houseoffusion.com/lists.cfm/link=s:4 Unsubscribe: http://www.houseoffusion.com/cf_lists/unsubscribe.cfm?user=89.70.4 Donations Support: http://www.houseoffusion.com/tiny.cfm/54
Re: OT: CSS mystery
That's awesome, it works beautifully now. It was driving me crazy. Also those extra periods were added after I posted. The code only has one period. bob ~| Message: http://www.houseoffusion.com/lists.cfm/link=i:4:229393 Archives: http://www.houseoffusion.com/cf_lists/threads.cfm/4 Subscription: http://www.houseoffusion.com/lists.cfm/link=s:4 Unsubscribe: http://www.houseoffusion.com/cf_lists/unsubscribe.cfm?user=89.70.4 Donations Support: http://www.houseoffusion.com/tiny.cfm/54
OT: CSS width in NS 7
Hey All, Sorry for the OT...but yer a smart bunch ;-) THE CODE: fieldset legendstrongGrouped things/strong/legend div style=display: block; margin: 5px; padding: 5px; width: 100%; label for=input1 class=NormalTextGrey style=width: 100px;Prompt 1/label input type=text name=input1 id=input1 / label for=input2 class=NormalTextGrey style=width: 100px;Prompt text 2/label input type=text name=input2 id=input2 / br label for=input3 class=NormalTextGrey style=width: 100px;Prompt text 3/label input type=text name=input3 id=input3 / !--- span style=width: 100px;Prompt 4/span --- label for=input4 class=NormalTextGrey style=width: 100px;Prompt 4/label input type=text name=input4 id=input4 / br label for=input5 class=NormalTextGrey style=width: 100px;Prompt text 5/label input type=text name=input5 id=input5 / label for=input6 class=NormalTextGrey style=width: 100px;Prompt text 6/label input type=text name=input6 id=input6 / /div /fieldset THE PROBLEM: The style=width: 100px; is totally ignored in NS 7 but fine in IE 6 and Opera 7+. So instead of inputs all left justified, I get them staggered depending upon the length of the prompt text (basically like collapsing cells in a table)...looks awful. Any tips? TIA Cheers Bryan Stevenson B.Comm. VP Director of E-Commerce Development Electric Edge Systems Group Inc. phone: 250.480.0642 fax: 250.480.1264 cell: 250.920.8830 e-mail: [EMAIL PROTECTED] web: www.electricedgesystems.com ~| Logware (www.logware.us): a new and convenient web-based time tracking application. Start tracking and documenting hours spent on a project or with a client with Logware today. Try it for free with a 15 day trial account. http://www.houseoffusion.com/banners/view.cfm?bannerid=67 Message: http://www.houseoffusion.com/lists.cfm/link=i:4:224240 Archives: http://www.houseoffusion.com/cf_lists/threads.cfm/4 Subscription: http://www.houseoffusion.com/lists.cfm/link=s:4 Unsubscribe: http://www.houseoffusion.com/cf_lists/unsubscribe.cfm?user=11502.10531.4 Donations Support: http://www.houseoffusion.com/tiny.cfm/54
Re: OT: CSS width in NS 7
by default labels are inline elements which shouldn't follow the width declaration. In your css you can set up the following: style label {display:block;float:left;} /style Then all the labels will follow the width declaration. Of course, you open a whole new can of worms with the float :) On 11/15/05, Bryan Stevenson [EMAIL PROTECTED] wrote: Hey All, Sorry for the OT...but yer a smart bunch ;-) THE CODE: fieldset legendstrongGrouped things/strong/legend div style=display: block; margin: 5px; padding: 5px; width: 100%; label for=input1 class=NormalTextGrey style=width: 100px;Prompt 1/label input type=text name=input1 id=input1 / label for=input2 class=NormalTextGrey style=width: 100px;Prompt text 2/label input type=text name=input2 id=input2 / br label for=input3 class=NormalTextGrey style=width: 100px;Prompt text 3/label input type=text name=input3 id=input3 / !--- span style=width: 100px;Prompt 4/span --- label for=input4 class=NormalTextGrey style=width: 100px;Prompt 4/label input type=text name=input4 id=input4 / br label for=input5 class=NormalTextGrey style=width: 100px;Prompt text 5/label input type=text name=input5 id=input5 / label for=input6 class=NormalTextGrey style=width: 100px;Prompt text 6/label input type=text name=input6 id=input6 / /div /fieldset THE PROBLEM: The style=width: 100px; is totally ignored in NS 7 but fine in IE 6 and Opera 7+. So instead of inputs all left justified, I get them staggered depending upon the length of the prompt text (basically like collapsing cells in a table)...looks awful. Any tips? TIA Cheers Bryan Stevenson B.Comm. VP Director of E-Commerce Development Electric Edge Systems Group Inc. phone: 250.480.0642 fax: 250.480.1264 cell: 250.920.8830 e-mail: [EMAIL PROTECTED] web: www.electricedgesystems.com ~| Logware (www.logware.us): a new and convenient web-based time tracking application. Start tracking and documenting hours spent on a project or with a client with Logware today. Try it for free with a 15 day trial account. http://www.houseoffusion.com/banners/view.cfm?bannerid=67 Message: http://www.houseoffusion.com/lists.cfm/link=i:4:224241 Archives: http://www.houseoffusion.com/cf_lists/threads.cfm/4 Subscription: http://www.houseoffusion.com/lists.cfm/link=s:4 Unsubscribe: http://www.houseoffusion.com/cf_lists/unsubscribe.cfm?user=89.70.4 Donations Support: http://www.houseoffusion.com/tiny.cfm/54
Re: OT: CSS width in NS 7
here's a link to accompany my answer: http://www.quirksmode.org/css/forms.html On 11/15/05, Marlon Moyer [EMAIL PROTECTED] wrote: by default labels are inline elements which shouldn't follow the width declaration. In your css you can set up the following: style label {display:block;float:left;} /style Then all the labels will follow the width declaration. Of course, you open a whole new can of worms with the float :) On 11/15/05, Bryan Stevenson [EMAIL PROTECTED] wrote: Hey All, Sorry for the OT...but yer a smart bunch ;-) THE CODE: fieldset legendstrongGrouped things/strong/legend div style=display: block; margin: 5px; padding: 5px; width: 100%; label for=input1 class=NormalTextGrey style=width: 100px;Prompt 1/label input type=text name=input1 id=input1 / label for=input2 class=NormalTextGrey style=width: 100px;Prompt text 2/label input type=text name=input2 id=input2 / br label for=input3 class=NormalTextGrey style=width: 100px;Prompt text 3/label input type=text name=input3 id=input3 / !--- span style=width: 100px;Prompt 4/span --- label for=input4 class=NormalTextGrey style=width: 100px;Prompt 4/label input type=text name=input4 id=input4 / br label for=input5 class=NormalTextGrey style=width: 100px;Prompt text 5/label input type=text name=input5 id=input5 / label for=input6 class=NormalTextGrey style=width: 100px;Prompt text 6/label input type=text name=input6 id=input6 / /div /fieldset THE PROBLEM: The style=width: 100px; is totally ignored in NS 7 but fine in IE 6 and Opera 7+. So instead of inputs all left justified, I get them staggered depending upon the length of the prompt text (basically like collapsing cells in a table)...looks awful. Any tips? TIA Cheers Bryan Stevenson B.Comm. VP Director of E-Commerce Development Electric Edge Systems Group Inc. phone: 250.480.0642 fax: 250.480.1264 cell: 250.920.8830 e-mail: [EMAIL PROTECTED] web: www.electricedgesystems.com ~| Logware (www.logware.us): a new and convenient web-based time tracking application. Start tracking and documenting hours spent on a project or with a client with Logware today. Try it for free with a 15 day trial account. http://www.houseoffusion.com/banners/view.cfm?bannerid=67 Message: http://www.houseoffusion.com/lists.cfm/link=i:4:224243 Archives: http://www.houseoffusion.com/cf_lists/threads.cfm/4 Subscription: http://www.houseoffusion.com/lists.cfm/link=s:4 Unsubscribe: http://www.houseoffusion.com/cf_lists/unsubscribe.cfm?user=89.70.4 Donations Support: http://www.houseoffusion.com/tiny.cfm/54
RE: OT: CSS
Its already there Barney (cept in IE of course, unless you download Dean Edward's IE7 fix) Attribute selectors allow you to work with selected tags based on their attributes input[type=checkbox], input[type=radio], input[type=submit]. Sandy Clark Interested in a 4 day hands on CSS Class? Running 11/29 - 12/2 in Rockville, MD http://www.teratech.com/training/oc_classes.cfm#CS201H -Original Message- From: Barney Boisvert [mailto:[EMAIL PROTECTED] Sent: Thursday, November 10, 2005 7:58 PM To: CF-Talk Subject: Re: OT: CSS Nope, sure isn't. Forms and CSS don't play very well, because EVERYTHING is an input tag. It'd be a lot better if they had individual tags for each element type, or at least had psuedo classes that would affect only certain elements. I.e. input::radio would only affect radio buttons. I'm not holding my breath for either one though. cheers, barneyb On 11/10/05, Bobby Hartsfield [EMAIL PROTECTED] wrote: Hey sorry for the OT but anyone worth asking comes here :) Is there a way to set a style for a particular input type? Example: I have a global style for input,textarea,select in my .css to automatically style all those elements throughout the app. That style has a thin border around all the fields but I don't want the border on input type=image... / fields... So is there a way to write a class for just input where the type = image that will be picked up automatically (so I don't have to add a class= to all of them)? Thanks for any tips! ..:.:.:.:.:.:.:.:.:.:.:.:.:.:. Bobby Hartsfield http://acoderslife.com -- Barney Boisvert [EMAIL PROTECTED] 360.319.6145 http://www.barneyb.com/ Got Gmail? I have 100 invites. ~| Logware (www.logware.us): a new and convenient web-based time tracking application. Start tracking and documenting hours spent on a project or with a client with Logware today. Try it for free with a 15 day trial account. http://www.houseoffusion.com/banners/view.cfm?bannerid=67 Message: http://www.houseoffusion.com/lists.cfm/link=i:4:223926 Archives: http://www.houseoffusion.com/cf_lists/threads.cfm/4 Subscription: http://www.houseoffusion.com/lists.cfm/link=s:4 Unsubscribe: http://www.houseoffusion.com/cf_lists/unsubscribe.cfm?user=89.70.4 Donations Support: http://www.houseoffusion.com/tiny.cfm/54
RE: OT: CSS
You mean like this? No. I was trying to avoid setting a different class for every element then having to go through the site and actually put class=myclass on those elements. But thanks to IE, I guess I'm going to have to do just that... sigh. Thanks everyone. ..:.:.:.:.:.:.:.:.:.:.:.:.:.:. Bobby Hartsfield http://acoderslife.com -- No virus found in this outgoing message. Checked by AVG Free Edition. Version: 7.1.362 / Virus Database: 267.12.8/166 - Release Date: 11/10/2005 ~| Discover CFTicket - The leading ColdFusion Help Desk and Trouble Ticket application http://www.houseoffusion.com/banners/view.cfm?bannerid=48 Message: http://www.houseoffusion.com/lists.cfm/link=i:4:223930 Archives: http://www.houseoffusion.com/cf_lists/threads.cfm/4 Subscription: http://www.houseoffusion.com/lists.cfm/link=s:4 Unsubscribe: http://www.houseoffusion.com/cf_lists/unsubscribe.cfm?user=11502.10531.4 Donations Support: http://www.houseoffusion.com/tiny.cfm/54
RE: OT: CSS
IE being the most popular browser in the webstats of any website I've done makes attribute selectors useless. If I've got to go set a class for it because of IE, then I may as well just let all other browsers use the class too... It sucks too because the attribute selectors are really cool. Thanks for the replies people :) ..:.:.:.:.:.:.:.:.:.:.:.:.:.:. Bobby Hartsfield http://acoderslife.com -Original Message- From: Sandy Clark [mailto:[EMAIL PROTECTED] Sent: Friday, November 11, 2005 8:21 AM To: CF-Talk Subject: RE: OT: CSS Its already there Barney (cept in IE of course, unless you download Dean Edward's IE7 fix) Attribute selectors allow you to work with selected tags based on their attributes input[type=checkbox], input[type=radio], input[type=submit]. Sandy Clark Interested in a 4 day hands on CSS Class? Running 11/29 - 12/2 in Rockville, MD http://www.teratech.com/training/oc_classes.cfm#CS201H -Original Message- From: Barney Boisvert [mailto:[EMAIL PROTECTED] Sent: Thursday, November 10, 2005 7:58 PM To: CF-Talk Subject: Re: OT: CSS Nope, sure isn't. Forms and CSS don't play very well, because EVERYTHING is an input tag. It'd be a lot better if they had individual tags for each element type, or at least had psuedo classes that would affect only certain elements. I.e. input::radio would only affect radio buttons. I'm not holding my breath for either one though. cheers, barneyb On 11/10/05, Bobby Hartsfield [EMAIL PROTECTED] wrote: Hey sorry for the OT but anyone worth asking comes here :) Is there a way to set a style for a particular input type? Example: I have a global style for input,textarea,select in my .css to automatically style all those elements throughout the app. That style has a thin border around all the fields but I don't want the border on input type=image... / fields... So is there a way to write a class for just input where the type = image that will be picked up automatically (so I don't have to add a class= to all of them)? Thanks for any tips! ..:.:.:.:.:.:.:.:.:.:.:.:.:.:. Bobby Hartsfield http://acoderslife.com -- Barney Boisvert [EMAIL PROTECTED] 360.319.6145 http://www.barneyb.com/ Got Gmail? I have 100 invites. ~| Find out how CFTicket can increase your company's customer support efficiency by 100% http://www.houseoffusion.com/banners/view.cfm?bannerid=49 Message: http://www.houseoffusion.com/lists.cfm/link=i:4:223931 Archives: http://www.houseoffusion.com/cf_lists/threads.cfm/4 Subscription: http://www.houseoffusion.com/lists.cfm/link=s:4 Unsubscribe: http://www.houseoffusion.com/cf_lists/unsubscribe.cfm?user=89.70.4 Donations Support: http://www.houseoffusion.com/tiny.cfm/54
OT: CSS
Hey sorry for the OT but anyone worth asking comes here :) Is there a way to set a style for a particular input type? Example: I have a global style for input,textarea,select in my .css to automatically style all those elements throughout the app. That style has a thin border around all the fields but I don't want the border on input type=image... / fields... So is there a way to write a class for just input where the type = image that will be picked up automatically (so I don't have to add a class= to all of them)? Thanks for any tips! ..:.:.:.:.:.:.:.:.:.:.:.:.:.:. Bobby Hartsfield http://acoderslife.com -- No virus found in this outgoing message. Checked by AVG Free Edition. Version: 7.1.362 / Virus Database: 267.12.8/165 - Release Date: 11/9/2005 ~| Discover CFTicket - The leading ColdFusion Help Desk and Trouble Ticket application http://www.houseoffusion.com/banners/view.cfm?bannerid=48 Message: http://www.houseoffusion.com/lists.cfm/link=i:4:223892 Archives: http://www.houseoffusion.com/cf_lists/threads.cfm/4 Subscription: http://www.houseoffusion.com/lists.cfm/link=s:4 Unsubscribe: http://www.houseoffusion.com/cf_lists/unsubscribe.cfm?user=11502.10531.4 Donations Support: http://www.houseoffusion.com/tiny.cfm/54
Re: OT: CSS
Nope, sure isn't. Forms and CSS don't play very well, because EVERYTHING is an input tag. It'd be a lot better if they had individual tags for each element type, or at least had psuedo classes that would affect only certain elements. I.e. input::radio would only affect radio buttons. I'm not holding my breath for either one though. cheers, barneyb On 11/10/05, Bobby Hartsfield [EMAIL PROTECTED] wrote: Hey sorry for the OT but anyone worth asking comes here :) Is there a way to set a style for a particular input type? Example: I have a global style for input,textarea,select in my .css to automatically style all those elements throughout the app. That style has a thin border around all the fields but I don't want the border on input type=image... / fields... So is there a way to write a class for just input where the type = image that will be picked up automatically (so I don't have to add a class= to all of them)? Thanks for any tips! ..:.:.:.:.:.:.:.:.:.:.:.:.:.:. Bobby Hartsfield http://acoderslife.com -- Barney Boisvert [EMAIL PROTECTED] 360.319.6145 http://www.barneyb.com/ Got Gmail? I have 100 invites. ~| Logware (www.logware.us): a new and convenient web-based time tracking application. Start tracking and documenting hours spent on a project or with a client with Logware today. Try it for free with a 15 day trial account. http://www.houseoffusion.com/banners/view.cfm?bannerid=67 Message: http://www.houseoffusion.com/lists.cfm/link=i:4:223893 Archives: http://www.houseoffusion.com/cf_lists/threads.cfm/4 Subscription: http://www.houseoffusion.com/lists.cfm/link=s:4 Unsubscribe: http://www.houseoffusion.com/cf_lists/unsubscribe.cfm?user=89.70.4 Donations Support: http://www.houseoffusion.com/tiny.cfm/54
Re: OT: CSS
I think you might be able to use Attributes selector for this purpose. An example although not tested input[type=button] { . } HTH On 11/10/05, Barney Boisvert [EMAIL PROTECTED] wrote: Nope, sure isn't. Forms and CSS don't play very well, because EVERYTHING is an input tag. It'd be a lot better if they had individual tags for each element type, or at least had psuedo classes that would affect only certain elements. I.e. input::radio would only affect radio buttons. I'm not holding my breath for either one though. cheers, barneyb On 11/10/05, Bobby Hartsfield [EMAIL PROTECTED] wrote: Hey sorry for the OT but anyone worth asking comes here :) Is there a way to set a style for a particular input type? Example: I have a global style for input,textarea,select in my .css to automatically style all those elements throughout the app. That style has a thin border around all the fields but I don't want the border on input type=image... / fields... So is there a way to write a class for just input where the type = image that will be picked up automatically (so I don't have to add a class= to all of them)? Thanks for any tips! ..:.:.:.:.:.:.:.:.:.:.:.:.:.:. Bobby Hartsfield http://acoderslife.com -- Barney Boisvert [EMAIL PROTECTED] 360.319.6145 http://www.barneyb.com/ Got Gmail? I have 100 invites. ~| Logware (www.logware.us): a new and convenient web-based time tracking application. Start tracking and documenting hours spent on a project or with a client with Logware today. Try it for free with a 15 day trial account. http://www.houseoffusion.com/banners/view.cfm?bannerid=67 Message: http://www.houseoffusion.com/lists.cfm/link=i:4:223900 Archives: http://www.houseoffusion.com/cf_lists/threads.cfm/4 Subscription: http://www.houseoffusion.com/lists.cfm/link=s:4 Unsubscribe: http://www.houseoffusion.com/cf_lists/unsubscribe.cfm?user=11502.10531.4 Donations Support: http://www.houseoffusion.com/tiny.cfm/54
RE: OT: CSS
I tried exactly that before I asked and it didnt work :^/ Well... not exactly, I tried input[type=image] {border:0px;} ..:.:.:.:.:.:.:.:.:.:.:.:.:.:. Bobby Hartsfield http://acoderslife.com -Original Message- From: Qasim Rasheed [mailto:[EMAIL PROTECTED] Sent: Thursday, November 10, 2005 9:22 PM To: CF-Talk Subject: Re: OT: CSS I think you might be able to use Attributes selector for this purpose. An example although not tested input[type=button] { .. } HTH On 11/10/05, Barney Boisvert [EMAIL PROTECTED] wrote: Nope, sure isn't. Forms and CSS don't play very well, because EVERYTHING is an input tag. It'd be a lot better if they had individual tags for each element type, or at least had psuedo classes that would affect only certain elements. I.e. input::radio would only affect radio buttons. I'm not holding my breath for either one though. cheers, barneyb On 11/10/05, Bobby Hartsfield [EMAIL PROTECTED] wrote: Hey sorry for the OT but anyone worth asking comes here :) Is there a way to set a style for a particular input type? Example: I have a global style for input,textarea,select in my .css to automatically style all those elements throughout the app. That style has a thin border around all the fields but I don't want the border on input type=image... / fields... So is there a way to write a class for just input where the type = image that will be picked up automatically (so I don't have to add a class= to all of them)? Thanks for any tips! ..:.:.:.:.:.:.:.:.:.:.:.:.:.:. Bobby Hartsfield http://acoderslife.com -- Barney Boisvert [EMAIL PROTECTED] 360.319.6145 http://www.barneyb.com/ Got Gmail? I have 100 invites. ~| Logware (www.logware.us): a new and convenient web-based time tracking application. Start tracking and documenting hours spent on a project or with a client with Logware today. Try it for free with a 15 day trial account. http://www.houseoffusion.com/banners/view.cfm?bannerid=67 Message: http://www.houseoffusion.com/lists.cfm/link=i:4:223909 Archives: http://www.houseoffusion.com/cf_lists/threads.cfm/4 Subscription: http://www.houseoffusion.com/lists.cfm/link=s:4 Unsubscribe: http://www.houseoffusion.com/cf_lists/unsubscribe.cfm?user=89.70.4 Donations Support: http://www.houseoffusion.com/tiny.cfm/54
RE: OT: CSS
Yeah, that's what I was afraid of. Thanks for the input. I actually need to change the style for radios and checks too now that you mention it. Input:radio,check,button,image {}would be sweet! ..:.:.:.:.:.:.:.:.:.:.:.:.:.:. Bobby Hartsfield http://acoderslife.com -Original Message- From: Barney Boisvert [mailto:[EMAIL PROTECTED] Sent: Thursday, November 10, 2005 7:58 PM To: CF-Talk Subject: Re: OT: CSS Nope, sure isn't. Forms and CSS don't play very well, because EVERYTHING is an input tag. It'd be a lot better if they had individual tags for each element type, or at least had psuedo classes that would affect only certain elements. I.e. input::radio would only affect radio buttons. I'm not holding my breath for either one though. cheers, barneyb On 11/10/05, Bobby Hartsfield [EMAIL PROTECTED] wrote: Hey sorry for the OT but anyone worth asking comes here :) Is there a way to set a style for a particular input type? Example: I have a global style for input,textarea,select in my .css to automatically style all those elements throughout the app. That style has a thin border around all the fields but I don't want the border on input type=image... / fields... So is there a way to write a class for just input where the type = image that will be picked up automatically (so I don't have to add a class= to all of them)? Thanks for any tips! ..:.:.:.:.:.:.:.:.:.:.:.:.:.:. Bobby Hartsfield http://acoderslife.com -- Barney Boisvert [EMAIL PROTECTED] 360.319.6145 http://www.barneyb.com/ Got Gmail? I have 100 invites. ~| Logware (www.logware.us): a new and convenient web-based time tracking application. Start tracking and documenting hours spent on a project or with a client with Logware today. Try it for free with a 15 day trial account. http://www.houseoffusion.com/banners/view.cfm?bannerid=67 Message: http://www.houseoffusion.com/lists.cfm/link=i:4:223911 Archives: http://www.houseoffusion.com/cf_lists/threads.cfm/4 Subscription: http://www.houseoffusion.com/lists.cfm/link=s:4 Unsubscribe: http://www.houseoffusion.com/cf_lists/unsubscribe.cfm?user=11502.10531.4 Donations Support: http://www.houseoffusion.com/tiny.cfm/54
RE: OT: CSS
You mean like this? http://diyframing.dev.web-architect.co.uk/test.cfm The image in the centre column is in a form field and has no border... Be warned, this site is very much in development at the moment and I've knocked up this page as an example especially for this question Feel free to look at the source and the CSS file... http://diyframing.dev.web-architect.co.uk/styles/diyframing.css Paul -Original Message- From: Bobby Hartsfield [mailto:[EMAIL PROTECTED] Sent: 11 November 2005 04:42 To: CF-Talk Subject: RE: OT: CSS I tried exactly that before I asked and it didn't work :^/ Well... not exactly, I tried input[type=image] {border:0px;} ..:.:.:.:.:.:.:.:.:.:.:.:.:.:. Bobby Hartsfield http://acoderslife.com ~| Find out how CFTicket can increase your company's customer support efficiency by 100% http://www.houseoffusion.com/banners/view.cfm?bannerid=49 Message: http://www.houseoffusion.com/lists.cfm/link=i:4:223919 Archives: http://www.houseoffusion.com/cf_lists/threads.cfm/4 Subscription: http://www.houseoffusion.com/lists.cfm/link=s:4 Unsubscribe: http://www.houseoffusion.com/cf_lists/unsubscribe.cfm?user=89.70.4 Donations Support: http://www.houseoffusion.com/tiny.cfm/54