Re: [css-d] disappearing content in IE
On Mar 24, 2006, at 2:13 PM, David Feldman wrote: Anyone encountered anything like this before? Peekaboo Bug? http://www.positioniseverything.net/explorer/peekaboo.html __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7b2 testing hub -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Question about and targeting IE/Mac
Hi Adam, thanks so much for you quick response! I really appreciate the help. :) On Mar 24, 2006, at 2:26 PM, Adam Kuehn wrote: What is your markup? Doh! sorry about that... Hehe, noob mistake. :: blushes :: div id=hNav dl dt/dt dd/dd /dl /div Based on those selectors, you have moved from something like this: div dl class=hNavdd/dd/dl /div To something like this: div id=hNav dldd/dd/dl Correct. I am retrofitting a menu I coded/used on one of my old websites. So, it sounds like this would be the correct syntax: * htmlbody #hNav dldd If the code directly above is correct, would this also work (keeping in mind that I only want to target IE/Mac): * htmlbody #hNav dl dd Hehe, I am just not used to using the selector. Google'ing now. :) Btw, thanks so much for giving me an example, it was really informative. Again, I really appreciate your help and time. Basically, YOU ROCK! TIA! Cheers, Micky __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7b2 testing hub -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Question about and targeting IE/Mac
On Mar 24, 2006, at 2:42 PM, Michael Hulse wrote: div id=hNav dl dt/dt dd/dd /dl /div Hi, me again... actually, still Googling, but... I just wanted to mention that the menu is surround by several other divs in the overall document... does that matter? Would I have to do something like this then: * htmlbody #div #div #hNav dldd I would assume not, because I am saying start with #hNav of the body tag... right? Thanks thanks thanks, Cheers, Micky __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7b2 testing hub -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
[css-d] Front-page search box: Room for CSS improvement?
Hi folks,
Below is HTML/CSS for a home page search box... I want the label,
input, and search button graphic to align all on one line.
Example via Safari: http://www.ambiguism.com/CSSD/form.gif
How could I improve-upon this code (basically I want it to be as
cross-browser/platform compatible as possible, so far it works perfect
in Safari - I did not include my code for fieldset/legend, but feel
free to post bullet-proof code for that too):
form { margin: 0; padding: 0; }
form * { vertical-align: middle; }
label {
font-size: .7em;
font-weight: bold;
letter-spacing: .1em;
text-align: right;
color: #fff;
width: 5em;
float: left; /* -- Worried about this and IE/PC */
}
input.searchBox {
border-width: 1px;
border-style: solid;
border-color: #555 #ccc;
padding: 1px;
width: 125px;
height: 14px;
}
input.imgGo {
width: 16px;
height: 16px;
}
input:focus {
background: #efefef;
color: #000;
}
fieldset
legendSearch our site:/legend
label for=searchSearch:nbsp;/labelinput
class=searchBox
type=text value= name=search id=search maxlength=100 /
input class=imgGo type=image name=btnSearch
id=btnSearch
src=/images/template/go.gif onclick=document.form1.submit(); /
/fieldset
Links, tuts, examps, suggestions?
Many many many TIA,
Cheers,
Micky
__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
IE7b2 testing hub -- http://css-discuss.incutio.com/?page=IE7
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] body: margin=0 and padding=0, not working in Firefox or Opera - Problem solved
On Mar 19, 2006, at 4:21 PM, SED wrote: I found out why the extra empty line showed up in Firefox and Opera. The margin and padding for p tag must also be set to zero, not only body. Weird, but it works. I think someone would have caught that if your code sample had the p tag in it. Glad you got it working. Micky __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7b2 testing hub -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] body: margin=0 and padding=0, not working in Firefox or Opera
On Mar 18, 2006, at 6:38 PM, SED wrote: html head/head link href=main.css rel=stylesheet type=text/css bodydiv class=containerbla, bla, bla/div /body /html What happens when you try this: html head link href=main.css rel=stylesheet type=text/css /head body div class=containerbla, bla, bla/div /body /html Also, you do not need to specify units for zero. Hth, M __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7b2 testing hub -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
[css-d] IE7b2, interesting Sitepoint articles:
Just thought I would post some links to a couple of articles published via Sitepoint.com newsletters: • IE7: The 'IEagle' has Landed http://snipurl.com/mrrt • Introduction: Let's get to work! • CSS: Fixing SitePoint for IE7 http://snipurl.com/mrrw If anyone is curious, Sitepoint offers some decent newsletters, browse here: http://www.sitepoint.com/newsletter/archives Cheers, Micky __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7b2 testing hub -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Centering a List Menu
On Feb 19, 2006, at 9:47 PM, Tyson Tate wrote: I'm trying to create a centered menu using a ul that looks like so: http://ohgoditburns.net/wp-content/uploads/2006/02/desired_menu.gif The links are regular and don't use image replacement. I can get the menu just fine using most any list menu technique, but I can't center it on the page as shown in the link above. A few links to solid list menus that are centered: http://www.l-c-n.com/IE5tests/phantom-links/test_2b.html http://webhost.bridgew.edu/etribou/layouts/skidoo/ Also, check out the main horizontal nav for Sitepoint.com: http://www.sitepoint.com/ M __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7b2 testing hub -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] vertical stretch .. just can't get it
On Feb 6, 2006, at 10:37 PM, Peter Lindstrom wrote: why can't I just have: div header - height fixed div col1 - fixed width/div div col2 - fixed width/div div col3 - width to fill page/div /div That would be nice, but then again, everyone and their dog would be web designers... no thanks. Have you surfed these sites: http://www.cssbeauty.com/ http://cssdrive.com/ http://www.nv30.com/mt/blogomania/index.php http://cssvault.com/ http://www.stylegala.com/ http://www.unmatchedstyle.com/ http://www.weeklystandards.com/ http://www.webstandardsawards.com/ http://www.cssreboot.com/ http://txpmagazine.kbbu.de/all_sites/ http://cssdesign.se/ __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7b2 testing hub -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Is there a CSS hack png transparency?
On Jan 28, 2006, at 2:47 PM, Abyss Information wrote: it falls over and doesn't work is there a CSS hack for this? CSSd WIKI search for PNG: http://css-discuss.incutio.com/?action=findfind=PNG CSSd Archive search for transparency: http://archivist.incutio.com/viewlist/css-discuss/css-discuss? search=transparency Hth, gl, Cheers, Micky -- ¸.·´¯`·.¸¸(((º`·.¸¸.·´¯`·.¸¸º ·´¯`·.¸¸.·´¯`·.¸¸.·´¯`·.¸¸.·´¯`·.¸¸º `·.¸¸º¸.·´¯`·.¸¸º __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] z-index with flash in firefox
On Jan 27, 2006, at 1:06 PM, Tanya Renne wrote: can someone diagnose a fix for that? Z-index is still baffling to me. I suggest using wmode=opaque. www.communitymx.com article pertaining to Flash, DHTML Menus and Accessibility: http://snipurl.com/m08r __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] problem in mac IE 5.2
On Jan 25, 2006, at 2:40 PM, D Ross wrote: FORGET about ie mac - don't worry about..dont waste thought on it. It's gone bye bye. Some people can't forget about it. Example: My work (newspaper) uses page layout software that is OS9 only. All the staff who uses this software also uses IE 5.x as a browser. The newspaper website had to work well in that browser. It may be a small percentage of users who still use that browser, but I have found that it is not too much more coding to get my CSS to function well in that browser. l-c-n is a great resource for mac issues: http://www.l-c-n.com/IE5tests/ As is: http://www.macedition.com/cb/ie5macbugs/ M -- ¸.·´¯`·.¸¸(((º`·.¸¸.·´¯`·.¸¸º ·´¯`·.¸¸.·´¯`·.¸¸.·´¯`·.¸¸.·´¯`·.¸¸º `·.¸¸º¸.·´¯`·.¸¸º __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] how to vertically align text?
On Jan 24, 2006, at 2:12 PM, Matthew Levine wrote:
On Jan 24, 2006, at 3:30 PM, Francesco wrote:
The text inside the LI appears lower slightly lower
(almost subscripted) to the custom image. We usd to
fix such things with vertical-align: middle; before
CSS. How is this corrected now?
Francesco,
This is often a headache for me, too. I'd play around with the
padding, height, line-height, and vertical-align of the list items.
However, I usually resort to adding a few rows of transparent pixels
to the top of my bullet images.
Or, you could play around with background positioning.
Example code:
/* For list items: */
ul.giveBull {
font: normal 1em Verdana, Arial, Helvetica, sans-serif;
list-style: none;
}
ul.giveBull li {
padding: 0 0 5px 10px;
background: url(bullet.gif) no-repeat 0 .5em; /* Try
percentages or
pixels or whatever you want. Just make sure units are the same. */
}
/* End list item definitions */
Hth,
Micky
__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Organizing CSS
On Jan 20, 2006, at 9:38 AM, Bill Moseley wrote: I just looking for a few tips on how to organize CSS files. I kinda like how the CSS for most Ruthsarian Layouts is organized: http://webhost.bridgew.edu/etribou/layouts/index.html My personal technique is to link from index page like so: link rel=stylesheet href=./css/master.css type=text/css media=screen / ... and within master.css: /*--( IMPORT STYLE: )-*/ @import url(general.css); @import url(layout.css); @import url(links.css); @import url(nav_horiz.css); @import url(nav_vert.css); @import url(forms.css); @import url(pending.css); /**/ I am still refining my system as time goes on, but seems to work best for me. Gl, hth, Cheers, Micky -- ¸.·´¯`·.¸¸(((º`·.¸¸.·´¯`·.¸¸º ·´¯`·.¸¸.·´¯`·.¸¸.·´¯`·.¸¸.·´¯`·.¸¸º `·.¸¸º¸.·´¯`·.¸¸º __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Form field colours
On Jan 21, 2006, at 2:17 PM, Vicki Stebbins wrote: I set the background colour via the CSS to reflect a grey colour for the background in the text boxes, which works fine in FF and Opera but in IE6.0 it randomly shows some of the text boxes 'yellow'??? I get this same exact problem! I have noticed that when I submit the form, and then hit the back button, the yellow will disappear. My forms are all CSS... I am also applying a (non-yellow) color to the background of the input tags. Unfortunately, I have had not time to trouble-shoot... Sorry, no fix from me. I too would love to hear a fix. Thanks, Cheers, Micky -- BCC for Privacy: http://www.cs.rutgers.edu/~watrous/bcc-for-privacy.html My del.icio.us: http://del.icio.us/mhulse __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Header, 2 cols, fixed footer
On Jan 5, 2006, at 2:34 AM, Julian Voelcker wrote: Any advice, pointers to samples, etc would be appreciated. Here is an example, I think it is kinda like what you are looking for: Link: http://www.pmob.co.uk/temp/mac3column.htm Link description: 3 column layout - any column can be the longest. Footer will stay at bottom of window unless content is greater then it stays at bottom of document. Found here: http://www.pmob.co.uk/ Paul O'B rocks! He is one of several cool admins/advisors/mentors found on www.sitepoint.com. If the example link I gave above is not what you are looking for, you may want to poke around his root list of links... maybe another example will have what you need. Hth, Good luck, Cheers, Micky -- ¸.·´¯`·.¸¸(((º`·.¸¸.·´¯`·.¸¸º ·´¯`·.¸¸.·´¯`·.¸¸.·´¯`·.¸¸.·´¯`·.¸¸º `·.¸¸º¸.·´¯`·.¸¸º __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] preloading and background slices
On Jan 5, 2006, at 4:41 AM, [EMAIL PROTECTED] wrote: The slices on this page load at different times. Is there a way to delay the page loading until the all CSS background images are loaded. Or make them all apear at the same time? I tried the basic preloading (javascript) techniques but nothing really works. You could try Javascript preloading (or, probably better, preload with CSS[1]) techniques on some sort of splash/intro page. On Jan 5, 2006, at 7:55 AM, Miki Kersgard wrote: Not sure if this is what you want but, if you go back to the photoshop files (pre-slice) and save the jpegs as progressive they will all load at the same time but be blurred at first and then become progressively clearer. I did not think CSS background images could be progressive? [1] Do google search for preloading images with css. Good luck, Cheers, Micky -- BCC for Privacy: http://www.cs.rutgers.edu/~watrous/bcc-for-privacy.html My del.icio.us: http://del.icio.us/mhulse __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] * html div /* comment */ { ??
On Jan 3, 2006, at 11:50 PM, Gunlaug Sørtun wrote: Looks like 'property/**/: value;', which indeed hides from IE5 on win and Mac. Reference: http://www.dithered.com/css_filters/css_only/index.php Ah, perfect. :) Thanks Gunlaug, I really appreciate your help. Hehe, ok, so when are you going to ask a question I can answer! :D Bookmarking dithered.com filter reference now. ;) Many thanks, Cheers, Micky __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
[css-d] * html div /* comment */ { ??
Hello,
Does the comment found in below CSS hide the styles from IE5.0/Win
IE5/Mac?
* html #vNav dl dd a/* hide from IE5.0/Win IE5/Mac */ {
height: 0.01%;
}
Maybe I am blind, but I could not find:
* html div /* comment */ { }
via this reference page: http://centricle.com/ref/css/filters/
Thanks,
Micky
--
¸.·´¯`·.¸¸(((º`·.¸¸.·´¯`·.¸¸º
·´¯`·.¸¸.·´¯`·.¸¸.·´¯`·.¸¸.·´¯`·.¸¸º
`·.¸¸º¸.·´¯`·.¸¸º
__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] PNG24 - AlphaImageLoader - Feed gif to IE5 - Will this CSSapproach work?
Hi Jetboy! Thanks for your prompt response! I really appreciate your time. :D On Jan 2, 2006, at 3:59 AM, Rowan @ Jetboy wrote: I'd skip the hacks if I were you. Ah, thanks for the code. I think you are right... Separating the CSS into different style-sheets is the way to go. What would be the best way to target IE/Mac? Maybe I should still use the htmlbody filter? You need to remove the regular background for IE5.5+ or it'll try to display both of them. Ah, did not realize that, thanks for pointing that out. sizingMethod='image' is default, so it can be left out. Will do. Good to know. If you're running multiple versions of IE, IE5 will not pick up the conditional unless you do a registry hack. However, anyone *actually using IE5* as their main browser will see things correctly. Sounds good. I have not applied the registry hack to my testing PC, but I trust that it will work. Thanks for sharing your knowledge! I really appreciate it. Cheers, Micky __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] PNG24 - AlphaImageLoader - Feed gif to IE5 - Will thisCSSapproach work?
On Jan 2, 2006, at 4:36 AM, Rowan @ Jetboy wrote: IE5 on the Mac supports PNG transparency Ah! Right... Lol, I knew that. Hehe, well, I should have known that... Sometimes it is hard for me to remember these things... Anyway, thanks for pointing that one out too. :D If you start to get ambitious with IE5 Mac it can be a bit quirky though. Check out http://www.webmasterworld.com/forum83/4722-2-10.htm message #18 and #19 if you have problems. Ah, webmasterworld! Perfect, my second favorite web forum for CSS (Admin SuzyUK rocks!). Reading now, thanks for link. :D Cheers, Micky __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Image repeat, what a mess
On Jan 2, 2006, at 4:41 AM, Ian Young wrote:
Thoughts?
At a quick glance, I noticed this as a possible problem:
#container
{
float: right;
width: 100%;
margin-left: -210px;
background-image: url(./images/leftbar.gif);repeat-y;
}
Instead, try some variation of this (specifically the background part):
#container {
float: right;
width: 100%;
margin-left: -210px;
background: transparent url(./images/leftbar.gif) repeat-y scroll top
left;
}
Hth,
Micky
__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] dt and dd Elements into one line?
On Dec 27, 2005, at 2:59 PM, heinrich klassen wrote: how can i get a dd an dt into one row? i could not figure it out. A quick search on google for Definition Lists should yield some helpful results... This site will prob have what you need, or it will at least give you some good ideas: (Scroll down to the bottom of the page, look for header Style definition lists) http://www.maxdesign.com.au/presentation/definition/ Hth, Cheers, Micky __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] http://www.timbenzinger.com/
On Dec 19, 2005, at 5:06 PM, Jan Brasna wrote: It's some DOM magic AJAX comes to mind. On Dec 19, 2005, at 5:02 PM, Christian Heilmann wrote: An effect like the one on this page could be easily done with moo.fx http://moofx.mad4milk.net/ Breaks horribly in/on IE/Mac. :( -- ¸.·´¯`·.¸¸(((º`·.¸¸.·´¯`·.¸¸º ·´¯`·.¸¸.·´¯`·.¸¸.·´¯`·.¸¸.·´¯`·.¸¸º `·.¸¸º¸.·´¯`·.¸¸º __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] display: -moz-inline-box; () inline-block;
Hi!
On Dec 18, 2005, at 6:07 AM, Philippe Wittenbergh wrote:
Without knowing what you're trying to do, have you tried with display/
table+display:table-cell?
Here is a little experiment I did with various display types for a
'navbar' kind of things:
http://dev.l-c-n.com/inline-block/inline-list.php
Thanks so much for responding Philippe! I really appreciate your time.
:)
Also, thanks for the link, that looks very helpful.
Actually, I am happy you responded. For my horizontal menu, I started
with your menu examples found here:
http://www.l-c-n.com/IE5tests/phantom-links/test_2b.html
http://www.l-c-n.com/IE5tests/phantom-links/inline-block_list.php
(Using pieces of above two menus, I ended up with a centered horizontal
menu that is not floated and avoids phantom links on a Mac.)
The above and other menus/code found on your site work wonders (esp.
for the Mac)! Thanks!
Question: in my horizontal menu, I ended-up using -moz-inline-box like
so:
.nv dl dd a {
color: #fff;
line-height: normal;
letter-spacing: normal;
padding: .2em 1em;
display: -moz-inline-box; /* Fixes Firefox */
display: inline-block;
}
Using above code as example, would it be possible for you to explain
how I could replace -moz-inline-box with
display/table+display:table-cell?
I just downloaded Firefox 1.5/Mac, the above seems to work good... but
not sure on a PC. Will have to test later...
I am looking on the wiki now, but does anyone have any good links that
could help explain how/when I would apply
display/table+display:table-cell?
Thanks Philippe and Ingo! I really appreciate your responses! :D
Cheers,
Micky.
__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] display: -moz-inline-box; () inline-block;
On Dec 18, 2005, at 4:02 PM, Michael Hulse wrote: (Using pieces of above two menus, I ended up with a centered horizontal menu that is not floated and avoids phantom links on a Mac.) I should also mention that I was able to avoid setting widths on each menu item too... man, what a pain-in-the-butt to create something so simple well, simple if you do not care about IE/Mac... I guess it all depends on the situation. ;) M __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
[css-d] display: -moz-inline-box; () inline-block;
Hello all,
The below code makes Firefox on Mac to behave:
.nav {
display: -moz-inline-box; /* Fixes Firefox */
display: inline-block;
}
Any probs with -moz-inline-box in the PC world?
Any good alternatives that will get Firefox to recognize inline-block?
Man, I really need to get a PC.
Many thanks in advance. :)
Cheers,
Micky
__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] can this behavior be beaten out of IE
On Dec 16, 2005, at 12:09 AM, Gunlaug Sørtun wrote: Al Sparber presented what looked like a more compact solution on this list a week or two ago, which does the same. Check list-archives. On Dec 2, 2005, at 4:43 AM, Al Sparber wrote: As a point of information, we've had this page floating around a long time: http://www.projectseven.com/csslab/testing/minmax/cssp5.htm All of the expression solutions we write work in strict mode. Most are descendant from solutions we pack with custom products but are useful in their own right. Poke around some of our PagePack demos and other gems can be found :-) Thanks again Al for the link. :) My only prob with above technique is that IE/Mac ignores the script. __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] help with ie/mac
On Dec 12, 2005, at 8:52 AM, Emily Tarrant wrote: A couple of people also raised some other valid points about the design (sizing of text and boxes), so I will now go on to look at those more closely. Hello, I was reminded of this Ruthsarian layout when I saw your site: http://webhost.bridgew.edu/etribou/layouts/skidoo_too/gargoyles/ index.html Hth? Good luck! :) Cheers, Micky -- ¸.·´¯`·.¸¸(((º`·.¸¸.·´¯`·.¸¸º ·´¯`·.¸¸.·´¯`·.¸¸.·´¯`·.¸¸.·´¯`·.¸¸º `·.¸¸º¸.·´¯`·.¸¸º __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] links not clickable in Safari
On Dec 12, 2005, at 4:48 AM, Erik Visser wrote: in this the links in the left column are not clickable in safari: http://www.bartbleijerveld.nl/ http://www.bartbleijerveld.nl/css/skidoo_too.css anybody any idea how to solve this? They are clickable in the version of Safari I am using... v.1.3.1 __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] IE Mac check - problem with unordered list
On Dec 12, 2005, at 8:25 AM, Janet Lynn Ford wrote:
I've run into an IE Mac issue was wondering if anyone has seen the
problem before and knows how to fix it.
Yes! I hate IE/Mac because of that bug/weirdness...
Anyway, here are some links:
http://www.l-c-n.com/IE5tests/phantom-links/
Link Description: IE sometimes generates an active areas in the empty
left-hand region of a block-level element when text-align is set to
other than {text-align:left}. ... Some possible solutions ...
This one works really well in/on IE/Mac:
http://www.l-c-n.com/IE5tests/phantom-links/inline-block_list.php
If you are looking for a centered horizontal list menu, check out the
horizontal nav in this Ruthsarian Layout:
http://webhost.bridgew.edu/etribou/layouts/skidoo/
Hopefully that helps.
Micky
--
¸.·´¯`·.¸¸(((º`·.¸¸.·´¯`·.¸¸º
·´¯`·.¸¸.·´¯`·.¸¸.·´¯`·.¸¸.·´¯`·.¸¸º
`·.¸¸º¸.·´¯`·.¸¸º
__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] help with ie/mac
On Dec 11, 2005, at 10:38 AM, Emily Tarrant wrote: I'd be very grateful for any advice. I've tested it widely on PC and Mac and I think that IE/Mac is the only problem... Here is a real quick fix for IE/Mac... looks better in IE/Mac... Could use a lot more work... no guarantees for the PC (no time for me to test). http://www.ambiguism.com/CSSD/photoscom.html Only tested with Safari and IE on Mac. I x'd out a few things... just for testing bare-bones style. Hth, hopefully you get someone to fix-it-up real good! :D Cheers, Micky -- ¸.·´¯`·.¸¸(((º`·.¸¸.·´¯`·.¸¸º ·´¯`·.¸¸.·´¯`·.¸¸.·´¯`·.¸¸.·´¯`·.¸¸º `·.¸¸º¸.·´¯`·.¸¸º __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Centering multi-line Inline li
On Dec 9, 2005, at 2:28 PM, wendy wrote: Could someone please give me an idea as to how to make the five sections of text sit centered as a group within the #prefooter? Hello Wendy, Have you tried: margin: 0 auto; on #prefooter? M -- BCC for Privacy: http://www.cs.rutgers.edu/~watrous/bcc-for-privacy.html My del.icio.us: http://del.icio.us/mhulse __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Centering multi-line Inline li
On Dec 9, 2005, at 2:28 PM, wendy wrote: Thanks very much. I've just started on this project, so with luck the horrifying bits will be improved. Wendy A little better, but you may need to play around with the Tan hack: http://www.ambiguism.com/CSSD/wendy.html I am sure someone else will have a better solution. Also, I am just on a mac... so hard to test on PC... Hopefully that will give you ideas until someone else on the list can give you the best solution. Hth, Cheers, Micky -- BCC for Privacy: http://www.cs.rutgers.edu/~watrous/bcc-for-privacy.html My del.icio.us: http://del.icio.us/mhulse __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
[css-d] Using Fieldset/legend on non-form elements?
Hi list, What are you thoughts on using fieldsetlegend/legend/fieldset tags on/with non-form content? Anyone have suggestions for the best alternative (one that works on Mac/IE would be nice)? I am going for this look: [LEGEND]- Content, content, content.. That would be a horizontal border that spans 100% with the legend on top/left-middle. I am still doing google/wiki searches... Thanks in advance all, Cheers, Micky -- BCC for Privacy: http://www.cs.rutgers.edu/~watrous/bcc-for-privacy.html My del.icio.us: http://del.icio.us/mhulse __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Using Fieldset/legend on non-form elements?
On Dec 8, 2005, at 12:57 AM, Christian Heilmann wrote: There is one solution in the archives. No idea if it works on Mac/IE but I guess that is hackable. Actually, that does pretty well on IE/Mac... Can anyone tell me how it looks on a PC? http://www.ambiguism.com/CSSD/testing.html Any thoughts on improving (hehe, besides removing the inline CSS): div style=border:1px solid #000;padding: 0 10px 10px 10px;margin-top:10px; h3 name=pseudo-legend style=display:inline;padding:5px;font-weight:normal;height:20px; position:relative;z-index:101;top:-12px;background-color:#fff;Name/ h3br /Lorem ipsum I wish I had a cat./div So, I am going to assume that using fieldset/legend on/with non-form elements is a no-no? Thanks Christian! :) Cheers, Micky -- ¸.·´¯`·.¸¸(((º`·.¸¸.·´¯`·.¸¸º ·´¯`·.¸¸.·´¯`·.¸¸.·´¯`·.¸¸.·´¯`·.¸¸º `·.¸¸º¸.·´¯`·.¸¸º __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Using Fieldset/legend on non-form elements?
On Dec 8, 2005, at 12:48 AM, Michael Hulse wrote:
[LEGEND]-
Content, content, content..
Just out curiosity, how does this function on the PC:
http://www.ambiguism.com/CSSD/testing2.html
...
div.pseudoLegend {
padding: 0 1em;
background: #fff url(../images/dotted.gif) repeat-x 1% 50%;
}
div.pseudoLegend h3 {
font-size: 1.1em;
border: 1px solid red;
color: #3254B3;
padding: 5px;
display: -moz-inline-box;
display: inline-block;
background-color: #fff;
}
...
div class=pseudoLegend
h3 name=pseudo-legendWinch amp; Steering Bands/h3
/div
...
How worried should I be about display: -moz-inline-box;? I feel like I
am not seeing something obvious here... hmm... maybe I need to catch-up
on some sleep.
Thanks! :)
Cheers,
Micky
--
¸.·´¯`·.¸¸(((º`·.¸¸.·´¯`·.¸¸º
·´¯`·.¸¸.·´¯`·.¸¸.·´¯`·.¸¸.·´¯`·.¸¸º
`·.¸¸º¸.·´¯`·.¸¸º
__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] display: table-cell --- why?
Any thoughts on the CSS compatibility/browser support of display: table-cell;? If you use it, should you also be thinking about adding filters to other browsers that do not understand it? Thanks. :) M -- ¸.·´¯`·.¸¸(((º`·.¸¸.·´¯`·.¸¸º ·´¯`·.¸¸.·´¯`·.¸¸.·´¯`·.¸¸.·´¯`·.¸¸º `·.¸¸º¸.·´¯`·.¸¸º __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Forms: Fluid layout: Best technique?
On Dec 5, 2005, at 1:27 AM, Tony Crockford wrote: I generally refer to the ideas in use here: http://www.aplus.co.yu/css/forms/?css=1 Very helpful, thanks! :) Micky -- BCC for Privacy: http://www.cs.rutgers.edu/~watrous/bcc-for-privacy.html My del.icio.us: http://del.icio.us/mhulse __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
[css-d] Forms: Fluid layout: Best technique?
Hello, What would you suggest as the best technique for laying-out forms in a fluid-width site? Any fluid-width form examples available? I plan to use fieldsets/labels... I would prefer to have the label to the left of the input, not above. Any links, tips, suggestions would be greatly appreciated. Me = googling now... I just thought I would ask before I re-invent the wheel... Thanks all, I appreciate your time, Cheers, Micky -- ¸.·´¯`·.¸¸(((º`·.¸¸.·´¯`·.¸¸º ·´¯`·.¸¸.·´¯`·.¸¸.·´¯`·.¸¸.·´¯`·.¸¸º `·.¸¸º¸.·´¯`·.¸¸º __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Garbled Text In Firefox Under Suckerfish Dropdown
On Dec 2, 2005, at 12:04 AM, Christian Montoya wrote: I've found that most scripts that do not work in FF work fine once they are scripted correctly. That makes sense... Now I feel silly for pointing the finger at Firefox... :( M __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] #idname.classname - IE Support
On Dec 2, 2005, at 11:08 AM, Zoe M. Gillenwater wrote: This would work, but only because of the first part of the selector. The second part selects nothing in the HTML snippet provided. I just misunderstood the original question... All of the CSS I posted was intended to be exactly you you explained it. M -- ¸.·´¯`·.¸¸(((º`·.¸¸.·´¯`·.¸¸º ·´¯`·.¸¸.·´¯`·.¸¸.·´¯`·.¸¸.·´¯`·.¸¸º `·.¸º¸.·´¯`·.¸¸º __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] #idname.classname - IE Support
On Dec 1, 2005, at 3:41 AM, Kevin Cannon wrote:
div id=tabs class=ski.../div
#tabs.ski {
background-color: green;
}
Excuse my noobieneess...
Why not:
div id=tabs class=ski.../div
/* Make .ski green: */
#tabs .ski {
background-color: green;
}
/* Make .ski red: */
#tabsTwo .ski {
background-color: red;
}
/* Or, make #tabs and .ski green: */
#tabs, .ski {
background-color: green;
}
/* Or, even: */
#tabs, #tabs .ski {
background-color: green;
}
--
¸.·´¯`·.¸¸(((º`·.¸¸.·´¯`·.¸¸º
·´¯`·.¸¸.·´¯`·.¸¸.·´¯`·.¸¸.·´¯`·.¸¸º
`·.¸º¸.·´¯`·.¸¸º
__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
[css-d] Min-width/Max-width: IE PC/IE Mac too?
Hello,
Example code:
---snip---
#mainContainer {
min-width: 500px; /* IE doens't understand this property. */
/* IE Dynamic Expression to set the width: */
width:expression(document.body.clientWidth 500 ? 500px : 100% );
}
---/snip---
Questions:
1. How would I go about applying a Max-width also?
2. Should I be worried about the above expression breaking in IE7?
3. How would I get min-width and max-width to work in IE/Mac? The
above expression appears to have no affect on that browser/platform.
4. What would you suggest is a good max-width for a fluid-layout site?
Any help would be greatly appreciated. :)
Thanks, cheers,
Micky
--
¸.·´¯`·.¸¸(((º`·.¸¸.·´¯`·.¸¸º
·´¯`·.¸¸.·´¯`·.¸¸.·´¯`·.¸¸.·´¯`·.¸¸º
`·.¸º¸.·´¯`·.¸¸º
__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Garbled Text In Firefox Under Suckerfish Dropdown
On Dec 1, 2005, at 7:31 PM, cFA wrote: HI there, Ive got an issue in which when a line of text is overlapped (usually by a portion like half) in my suckerfish, that the text becomes garbled and fuzzy in Firefox. Yep, happens to me too with my own version of Suckerfish. I believe that it has to do with the Javascript. Try turning-off the JS for the Suckerfish drop-downs and I bet the problems disappear. Not too sure of a workaround for it. Seems like a Firefox bug/issue... Maybe fixed in the next update? Micky -- ¸.·´¯`·.¸¸(((º`·.¸¸.·´¯`·.¸¸º ·´¯`·.¸¸.·´¯`·.¸¸.·´¯`·.¸¸.·´¯`·.¸¸º `·.¸º¸.·´¯`·.¸¸º __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
[css-d] Adding a border to a div fixes gaps/margins/padding? Why?
Hello,
I have come-across a couple of different situations where I have added
a 1px solid border to a div, and it seemed to fix weird gaps and/or
made the child-content behave a bit better by tightening-up what
appears to be the padding/margins ... It is really hard to explain, and
I think it may only be a Mac thing...
With that said, does anyone have any links to examples/bugs that are
similar to the above oddity?
Am I crazy?
Side-note: I zero-out all of the margins and padding at the beginning
of my CSS using * {margin:0;padding:0;}.
Thanks,
Cheers,
Micky.
--
¸.·´¯`·.¸¸(((º`·.¸¸.·´¯`·.¸¸º
·´¯`·.¸¸.·´¯`·.¸¸.·´¯`·.¸¸.·´¯`·.¸¸º
`·.¸º¸.·´¯`·.¸¸º
__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Garbled Text In Firefox Under Suckerfish Dropdown
On 12/2/05, Michael Hulse [EMAIL PROTECTED] wrote: Why not just hide the JS from Firefox? If it's only needed for IE, then why oh why haven't you put it behind a conditional comment? Yeah, good idea. Hehe, I feel silly for not thinking of that... duh! On 12/2/05, Michael Hulse [EMAIL PROTECTED] wrote: Not too sure of a workaround for it. Seems like a Firefox bug/issue... Maybe fixed in the next update? I guess what I meant by Not too sure of a workaround was that I do not no how to fix a Firefox JS bug (if it is one, I am just making a big fat guess...). Conditional comments are a temp fix... although, for the Suckerfish JS, I agree, it is a very good idea just to feed it to IE... If it is a bug though, one would hope they would fix the problem rather than have us web-developers hide JS from Firefox... I am sure it happens with other scripts where the JS needs to be read by Firefox... Specifically, I think the problem has to do with the document.getElementById. I have seen this issue happen with other sites and other scripts in Firefox... Cheers, Micky -- BCC for Privacy: http://www.cs.rutgers.edu/~watrous/bcc-for-privacy.html My del.icio.us: http://del.icio.us/mhulse __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Min-width/Max-width: IE PC/IE Mac too?
On Dec 1, 2005, at 11:37 PM, Christian Montoya wrote: I think you are the best judge of that. Thanks for the response Christian, I really appreciate your time. :) I probably should not worry about IE/Mac, but I do (I am a Mac guy, and I also like the feeling of having my CSS look good in that browser/Platform... although, I probably have gotten the biggest headaches in my lifetime because of stupid IE/Mac bugs/issues...) Oh, I also just found this: (Gunlaug's IE-expressions in CSS) http://www.gunlaug.no/contents/wd_1_02_01.html#item3 Thanks! Cheers, Micky -- BCC for Privacy: http://www.cs.rutgers.edu/~watrous/bcc-for-privacy.html My del.icio.us: http://del.icio.us/mhulse __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] One pixel height line - FF vs IE
On Nov 29, 2005, at 4:33 PM, Mário Gamito wrote:
Is there a way to make this thing work well on both browsers ?
Hi,
Here is an example of a horizontal rule that uses a background image:
div.horizRule {
font-size: 1px;
line-height: 1px;
background: url(/img/dotted.gif) repeat-x left center;
padding: 10px 0;
height: 1px;
}
div class=horizRule/div
Hopefully that will send you in the right direction.
Micky
__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] One pixel height line - FF vs IE
On Nov 29, 2005, at 7:56 PM, Michael Hulse wrote:
div.horizRule {
font-size: 1px;
line-height: 1px;
background: url(/img/dotted.gif) repeat-x left center;
padding: 10px 0;
height: 1px;
}
Sorry,
padding: 10px 0; should be margin: 10px 0;. Or you could just zero
them out altogether margin: 0; padding: 0;.
m
__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
[css-d] When to use raw numbers for units?
Hello, I have always specified a unit when coding my CSS (except units of 0). I am wondering what, when, why, and where I would be specifying a raw # for units? Examples? Should I be coding like so: font: normal 76.1%/125 Lucida Sans Unicode, verdana, helvetica, sans-serif; Rather than: font: normal 76.1%/125% Lucida Sans Unicode, verdana, helvetica, sans-serif; In the above example, is specifying a unit for line-height a bad thing, sloppy, or just a matter of individual coding preference. Your thoughts would be greatly appreciated. Thanks list, Cheers, Micky -- (((º`·.¸¸.·´¯`·.¸.·´¯`·...¸º ·´¯`·.¸. , . .·´¯`·...¸º`·.¸¸.·´¯`·.¸.·´¯`·...¸º __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] When to use raw numbers for units?
Your thoughts would be greatly appreciated. Thanks for the responses all... very helpful, descriptive, and informative... as always, css-d rocks! Cheers, micky. __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Netscape not showing what it should
Hello,
Not too sure about your problems in NN... you might want to start here:
http://validator.w3.org/check?
uri=http%3A%2F%2F216.197.219.40%2Fam%2FLESA_ONE_am_7_files%2Ffdeflt.htm
A few screens from the Mac/OSX world:
Safari (I get the same javascript error twice):
http://www.ambiguism.com/CSSD/lesa01.jpg
http://www.ambiguism.com/CSSD/lesa02.jpg
IE 5.2.3 (Took forever - several minutes - to load on high-speed
cable... I ended-up force-quiting IE and never was able to get past the
javascript error message):
http://www.ambiguism.com/CSSD/lesa03.jpg
Good luck,
Cheers,
Micky
On Nov 25, 2005, at 10:58 PM, Lizet Pena de Sola wrote:
Hello all,
I'm new to the list and glad I found it.
I recently finished a small interface project that required the
customization of windows media player a couple of web pages.
The test url is:
http://216.197.219.40/am/LESA_ONE_am_7_files/
It works fine with IE6 but fails to load an entire part of the page
with NN. Any idea as to where the incompatibility is will be more than
welcome. Thanks in advance!
The code of that part (that is missing in NN) is as follows:
Note: I haven't cleaned up the code to show here.
!-- SLIDES FRAME --
div id=SlidesWrapper class=SlidesWrapperOndiv
id=SlidesDiv
align=center valign=middle style=position:relative; top:40px;
left:-2px;display:none;WMPrerollDisplay:none; z-index:0;
IFRAME src= id=SlidesFrame name=SlidesFrame width=100%
height=100% scrolling=no FRAMEBORDER=0 allowTransparency=true
/IFRAME
IFRAME id=SlidesCmd name=SlidesCmd
style=visibility:hidden;display:none;/IFRAME
/div/div
div id=Agenda class=AgendaOff/div
div id=Speakers class=SpeakersOff
onClick=javascript:showTab('Speakers');/div
div id=Materials class=MaterialsOff/div
div id=Help class=HelpOff/div
div id=RightHandArea style=position:absolute; top:180px;
left:374px; HEIGHT: 373px;WIDTH: 415px;
background-image:url(images/shadow-window-behind.gif);
background-repeat:no-repeat;display:none;WMPrerollDisplay:none/div
div id=SlidesOver onClick=javascript:showTab(this);/div
div id=AgendaOver onClick=javascript:showTab(this);/div
div id=SpeakersOver onClick=javascript:showTab(this);/div
div id=MaterialsOver onClick=javascript:showTab(this);/div
div id=HelpOver onClick=javascript:showTab(this);/div
style
#SlidesOver
{
position:absolute;
top:152px;
left:378px;
HEIGHT: 33px;
WIDTH: 75px;
background-color:transparent;
background-repeat:no-repeat;
display:none;
WMPrerollDisplay:none;
z-index:400;
OVERFLOW: hidden;
cursor:hand;
}
#AgendaOver
{
position:absolute;
top:152px;
left:465px;
HEIGHT: 33px;
WIDTH: 75px;
background-color:transparent;
background-repeat:no-repeat;
display:none;
WMPrerollDisplay:none;
z-index:400;
OVERFLOW: hidden;
cursor:hand;
}
#SpeakersOver
{
position:absolute;
top:152px;
left:553px;
HEIGHT: 33px;
WIDTH: 75px;
background-color:transparent;
background-repeat:no-repeat;
display:none;
WMPrerollDisplay:none;
z-index:400;
OVERFLOW: hidden;
cursor:hand;
}
#MaterialsOver
{
position:absolute;
top:152px;
left:638px;
HEIGHT: 33px;
WIDTH: 75px;
background-color:transparent;
background-repeat:no-repeat;
display:none;
WMPrerollDisplay:none;
z-index:400;
OVERFLOW: hidden;
cursor:hand;
}
#HelpOver
{
position:absolute;
top:152px;
left:720px;
HEIGHT: 33px;
WIDTH: 75px;
background-color:transparent;
background-repeat:no-repeat;
display:none;
WMPrerollDisplay:none;
z-index:400;
OVERFLOW: hidden;
cursor:hand;
}
.SlidesWrapperOn
{
position:absolute;
top:152px;
left:372px;
HEIGHT: 373px;
WIDTH: 413px;
background-image:url(images/slide-window-on.gif);
background-repeat:no-repeat;
display:none;
WMPrerollDisplay:none;
z-index:300;
OVERFLOW: hidden;
cursor:arrow;
}
.SlidesWrapperOff
{
position:absolute;
top:152px;
left:372px;
HEIGHT: 373px;
WIDTH: 413px;
background-image:url(images/slide-window-off.gif);
background-repeat:no-repeat;
display:none;
WMPrerollDisplay:none;
z-index:0;
OVERFLOW: hidden;
cursor:arrow;
}
.AgendaOn
{
position:absolute;
top:152px;
left:374px;
HEIGHT: 373px;
WIDTH: 415px; background-image:url(images/agenda-window-on.gif);
background-repeat:no-repeat;
display:none;
WMPrerollDisplay:none;
POSITION: absolute;
OVERFLOW:
Re: [css-d] Flash and CSS
On Nov 21, 2005, at 6:27 AM, Chad Calhoun wrote: Actually, if you're interested in using DENG, the CSS support is amazing (includes CSS3). Not ALL of the features are supported, but it is a lot better than Macromedia's base support. Whoa! Thanks for info! DENG is [EMAIL PROTECTED] cool! I am just starting research on this, but what would stop me from using this for the majority of all my web/CSS/Flash needs? Any negatives to using this for complete CSS/FLash compatibility? Anyone else use this? M __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Aligning text in same line
On Nov 23, 2005, at 1:36 PM, Lst Recv wrote: Is there anyway to have one line of text, with part of it aligned to the containers left and part of it to it's right? You might want to take a look at this ALA article (Scroll down to Splitting the Difference): http://www.alistapart.com/articles/practicalcss/ Link description: ...place two elements at opposite sides of the browser window. This might be a case where you have a small logo that you want at the top right corner of your page, and some navigational elements at the top left Hth, Cheers, Micky __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] I can never learn this - how do I center a part of my page
but how do I center this part? Hi, Check this page: http://www.sitepoint.com/forums/showpost.php?p=1239967postcount=4 Link description: FAQ :How to centre an existing page horizontally? ... The usual way to centre is to use margin-left:auto and margin-right:auto on the div. However , you will also need to supply a width for the surrounding div otherwise it will not centre, so you will need to supply a width large enough to hold your content including borders and padding etc. Basically you would want to wrap your content with a main container... There is a little-bit more to it than that, but the above link should get you headed in right direction. Above link found here: http://www.sitepoint.com/forums/showthread.php?t=171943page=1pp=25 __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] IE line wrapping problem
On Nov 23, 2005, at 2:18 PM, David Laakso wrote: font:.90%/1.2 Verdana,Arial,Helvetica,sans-serif; Some say one should use a raw number for line-height. By specifying no unit is that what you mean by raw number?? m __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Flash and CSS
On Nov 20, 2005, at 6:26 PM, Kat Lindsey wrote: Is it true you have limited use of the CSS tags in flash? And if so, does anyone know where I might be able to find out more about this business of creating styles using actionscript? You may want to subscribe to this list: http://chattyfig.figleaf.com/mailman/listinfo/flashcoders CSS Support in Flash MX 2004: http://whatdoiknow.org/archives/001181.shtml ...You may also want to look-into global styles in Flash... Comment on F8 and CSS: Too bad they didn't upgrade the css... still no line-height or margin-top or -bottom. What is the use of css if simple html like h1 and p do not display properly. Sure the new features are very cool, but designing a simple layout and getting it to work in flash with dynamic content is still a pain in the ass... I'm a bit dissapointed. ~ http://whatdoiknow.org/archives/002402.shtml (Found in comments) The Live Documentation may help... F8 Live Docs: http://livedocs.macromedia.com/flash/8/index.html MX Live Docs: http://livedocs.macromedia.com/flash/mx2004/index.html Do a search for Styles, that will yield a ton of interesting results. Hth, Micky __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Background Repeat Problems in Safari.
On Nov 17, 2005, at 6:54 AM, Keith Fjellman wrote:
body {
background: url(../images/webBG.gif);
background-repeat: repeat-y;
}
Try:
body {
background-image: url(../images/webBG.gif);
background-repeat: repeat-y;
}
I prefer shorthand:
body {
background: #666 url(pathToImage) repeat-y scroll 0 0;
}
Hth,
Micky
__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Placing divs using css over flash files
On Nov 17, 2005, at 3:15 PM, Angelo Ioculano wrote: Does anyone have a work around for this? Hello Angelo, Flash is always on top. Each browser will treat that object tag differently, but AFAIK, that is the word on the e-street... There may be a Javascript solution, but applying a z-index (may work for some browsers) is not the solution. You might try: param name=wmode value=transparent / EMBED src=swf.swf quality=best bgcolor=#FF wmode=transparent WIDTH=550 ... This thread has more info about embedding Flash/CSS/wmode: http://www.sitepoint.com/forums/showthread.php?t=158317 Looks like some have found a solution, but I bet none of them work well on Mac/browsers. If it were me, I would opt for an animated gif (esp. applicable if it is an advertisement), or move the Flash to a more suitable place on the page/redesign the layout... Good luck, Cheers, Micky __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Placing divs using css over flash files
On Nov 17, 2005, at 3:15 PM, Angelo Ioculano wrote: Does anyone have a work around for this? Hmmm, this article should help you out: http://www.communitymx.com/content/article.cfm?cid=E5141 His DHTML example seems to work fine on Mac/Safai/Firefox: http://www.communitymx.com/content/source/E5141/wmodeopaque.htm Although: ▪ Windowless Mode is not supported on Mac Classic ▪ It also does not work on Opera M -- BCC for Privacy: http://www.cs.rutgers.edu/~watrous/bcc-for-privacy.html My del.icio.us: http://del.icio.us/mhulse __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Disappearing background on list in IE
On Nov 15, 2005, at 1:05 AM, Ali Lee wrote: I'm trying to get a dotted border showing on the bottom of each list item in a ul used for navigation, http://www.alistapart.com/articles/customunderlines/ • The above ALA article may give you some good ideas on how you would go about using images for custom link underlines. however whenever I use border-bottom: 1px dotted #0C2577; I get a dashed line instead of dotted in IE. Dotted borders will display as dashed in win/IE... suxors. :( You might try: 1. Specify a border-size of 2px. This should give you dotted borders in IE (but, IMHO, 2px dotted does not look as good as 1px dotted... Hmmm, will IE7 display 1px dotted borders correctly??). 2. Using filters, feed IE/PC 1px solid borders and give everyone else 1px dotted borders. 3. Use images (quickly slapped-together... used ALA technique): http://www.ambiguism.com/CSSD/custlistunder/custom-list-underlines.html Hth, Cheers, Micky -- BCC for Privacy: http://www.cs.rutgers.edu/~watrous/bcc-for-privacy.html My del.icio.us: http://del.icio.us/mhulse __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] removing IE border on linked images
On Nov 14, 2005, at 9:31 PM, bill wrote:
I probably should've done this in the first place but since the fixes
you sent -- they were all the same fix BTW: img a { border: none; } --
didn't fix my problem
Hi Bill,
I know it is easy to mix things up, but did you happen to try reversing
the img and the a like this:
a img { border: none; }
Translated, that means any img element which is a descendent of an
a element will have no border styling.
Hth, Cheers, Micky
--
BCC for Privacy: http://www.cs.rutgers.edu/~watrous/bcc-for-privacy.html
--
My del.icio.us: http://del.icio.us/mhulse
__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] removing IE border on linked images
On Nov 14, 2005, at 9:57 PM, bill wrote: Thanks Mickey, That did it. I just need to re-space those images in the container now. It actually makes more sense your way Glad it works for you now... don't forget to thank bill [EMAIL PROTECTED] too. :) I quoted his original response in my last response to you. Cheers, Micky. ;) __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
[css-d] @media {} filter: info/links/usage?
On Nov 3, 2005, at 6:13 AM, Gunlaug Sørtun wrote:
CSS filters are generally unsafe - except when used correctly to
separate dead browsers from the living. IE6 and previous versions
are dead, and can be filtered out safely. CSS filter for IE5+/win
only, targeting versions less than IE7. Can be used in 'styles in page
head' and 'external stylesheets'. Must be used _complete with @media
rule_, and put after all other styles so not to interfere with other
@media rules if there are any. No further separation needed. Example:
@media all {
* html #nv ul li a {
float: right /* IE5.0 + 5.5 + 6 win */;
float/**/: none /* IE5.5 win */;
fl\oat: none /* IE6 win */;
}
}
...safe filter if later versions than IE6 are set to run in 'standard
mode', according to the Microsoft IE7 team.
Hey Georg and others,
So, I would like to learn more about the above @media filter... If I
ever use it again, I want to be sure I am applying it correctly.
I have read that using @media will hide from these browsers:
• Netscape 4.x
• Mac IE 4.01
• Mac IE 5.0
• Win IE 4
• Konqueror 3.0
Questions:
1. Does anyone have a link to an (official) IE7 website/web-page that
talks about this filter?
2. Is this filter an acceptable alternative to conditional comments?
3. Could someone elaborate a bit more on this statement:
put after all other styles so not to interfere with other @media rules
if there are any
What happens if I do have other @media rules? If I did have other
@media rules, would I just combine them into one @media rule and put at
bottom of CSS?
Any help would be greatly appreciated. :)
Thanks m8s,
Cheers,
Micky
--
(((º`·.¸¸.·´¯`·.¸.·´¯`·...¸º
·´¯`·.¸. , . .·´¯`·...¸º`·.¸¸.·´¯`·.¸.·´¯`·...¸º
__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] @media {} filter: info/links/usage?
On Nov 13, 2005, at 6:40 AM, Gunlaug Sørtun wrote: --- That's it, me thinks. Hope I got all the details right. CSS sure is fun... :-) regards Georg WOW! Thanks Georg! Amazing advice and knowledge you have! I can not tell you how much I appreciate your help. :D I will be (re)reading this one many times over... great information! Thanks for throwing-in that part about IE/Mac, I always try to make my CSS work for that browser/OS if at all possible. Also, great article~! Exactly the type of information I was looking for. Now, where is that RSS feed? :) Again, thanks s much for you help. I can't wait to get back home later today and research this topic (I would keep thanking you over and over but unfortunately I have to go to work). Cheers! Micky -- (((º`·.¸¸.·´¯`·.¸.·´¯`·...¸º ·´¯`·.¸. , . .·´¯`·...¸º`·.¸¸.·´¯`·.¸.·´¯`·...¸º __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] clearing clears sidebar too
Good information Georg, you obviously know you shizzle. ;)
Cheers,
Micky
Michael Hulse wrote:
If you read that Sitepoint post about floats you should be able to
tackle the float-drop issue with ease.
Comment: floats don't drop in IE/win in a fixed-width layout, *unless*
some of the content pushes a float outwards so it becomes too wide.
That's one of IE/win's weaknesses, but it is not an issue in that page,
once it is made an all-float layout (like I suggested).
The negative 'margin-right: -10px' will catch the /italic-bug/ and a
few
other surprises IE/win may throw in just for fun :-)
Original source-code and CSS, and this CSS added:
#wrapper {display: table;}
#content {float: left; margin: 0 -10px 0 15px;}
...makes it an all-float.
Note to Trish: Moz/FF shows a minor deviation - 1px off (gosh).
Changing the margin will cover up for that:
#content {float: left; margin: 0 -10px 0 14px;}
...now tested fully in Moz/FF, Opera and IE6.
regards
Georg
__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] clearing clears sidebar too
Hehe, that should be:
Know your shizzle as in, know your stuff
I still think that Sitepoint link is excellent info, esp. for beginners.
http://www.sitepoint.com/forums/showthread.php?t=171943page=1pp=25
Cheers,
Micky
On Nov 12, 2005, at 12:35 AM, Michael Hulse wrote:
Good information Georg, you obviously know you shizzle. ;)
Cheers,
Micky
Michael Hulse wrote:
If you read that Sitepoint post about floats you should be able to
tackle the float-drop issue with ease.
Comment: floats don't drop in IE/win in a fixed-width layout, *unless*
some of the content pushes a float outwards so it becomes too wide.
That's one of IE/win's weaknesses, but it is not an issue in that
page,
once it is made an all-float layout (like I suggested).
The negative 'margin-right: -10px' will catch the /italic-bug/ and a
few
other surprises IE/win may throw in just for fun :-)
Original source-code and CSS, and this CSS added:
#wrapper {display: table;}
#content {float: left; margin: 0 -10px 0 15px;}
...makes it an all-float.
Note to Trish: Moz/FF shows a minor deviation - 1px off (gosh).
Changing the margin will cover up for that:
#content {float: left; margin: 0 -10px 0 14px;}
...now tested fully in Moz/FF, Opera and IE6.
regards
Georg
__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Who is up for a CSS challenge?
On Nov 11, 2005, at 6:31 PM, Christian Montoya wrote: Why do you have the form wrapped around the entire page? It seems to me that you're losing a valuable styling hook by not wrapping the form around just the login elements. yeah, was that a mistake? Maybe this: The form tag is there because this is an asp.net application which require forms for server-side interaction. ? Got me though... I am not an asp.net dude. M __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] clearing clears sidebar too
On Nov 11, 2005, at 9:52 PM, Trish Meyer wrote:
Hi all,
I hope this isn't too much of a challenge. I hope it's really easy to
fix... a really common error (that I just can't seem to find
anywhere).
I've got a new site mostly designed, but have run into a problem,
which I've explained in the body copy of the page at:
http://www.collageartists.org/test7x1.html
Basically, adding a clear: both to the headers in the main content
area, ALSO clears the #leftcol (sidebar). #leftcol is a floated
element, and #content moves to the right thanks to a left margin.
Everything is positioned: relative, nothing is absolute (if that
helps).
The CSS is at
http://www.collageartists.org/stylesheets/caa7_x1.css
Please help! I've troubleshooted this for hours and can't figure out
how to fix it.
thank you thank you thank you,
Trish
Have you tried clear: right?
I did not look at your CSS, and that probably is not the best solution,
if it is a solution at all... It sounds like a problem I have had b4,
and clear:right was a fix.
You may also want to try an inner content wrap (put inside content div
and wrap around all #content content... maybe something like this:
#innerContentWrap {
width: 100%;
float: left;
}
Hth, I am sure someone will give a waay better answer.
BTW, why are you clearing the headers in the first place? I have only
glanced at your code and source, so I apologize in advance if I send
you on a wild goose chase.
Micky
--
(((º`·.¸¸.·´¯`·.¸.·´¯`·...¸º
·´¯`·.¸. , . .·´¯`·...¸º`·.¸¸.·´¯`·.¸.·´¯`·...¸º
__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] clearing clears sidebar too
Hi trish,
On Nov 11, 2005, at 9:52 PM, Trish Meyer wrote:
Please help! I've troubleshooted this for hours and can't figure out
how to fix it.
Fixed it a little bit:
http://www.ambiguism.com/CSSD/caa.html
Added this to CSS:
#innerContentWrap {
width: 100%;
float: left;
}
/* Begin .theClearFix styles: */
.theClearFix:after {
content: .;
display: block;
height: 0;
clear: both;
visibility: hidden;
}
.theClearFix { display: inline-table; }
/* Begin filter. Hides from IE-mac \*/
* html .theClearFix { height: 1%; }
.theClearFix { display: block; }
/* End filter. End hide from IE-mac. */
/* End .theClearFix styles. */
I cleaned-up the html, makes it a bit more clear:
div id=content class=theClearFix
div id=innerContentWrap class=theClearFix
img src=images/lgoldberg_test160.jpg alt=test width=160
height=202 class=imgfloatleft/
h1Heading 1/h1
pThis is div#content and it is positioned relative to
div#wrapper/p
pdiv#wrapper holds #leftcol (the sidebar) and #content /p
p#leftcol (sidebar) is float=left/p
p#content moves to the right thanks to the right margin
amount/p
div class=clearboth/div
img src=images/belcher_test100.jpg alt=test width=100
height=139 class=imgfloatright /
h2Heading #2 +clear:both style /h2
pEverything works fine until
View source to see all the code.
I saw some other issues with your css (no time to delve into that now),
and I added borders to some of the divs to make it more obvious as to
what is going on.
Keep in mind, I quickly slapped this together... it already looks like
some of the gurus on the list have replied with solid answers...
hopefully a combination of all our help will solve your CSS troubles.
Cheers,
Micky
__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] sitecheck / lists equal in ie+ff
On Nov 9, 2005, at 2:50 PM, Mauricio Giraldo Arteaga wrote:
I just finished a mainly CSS site:
http://www.museoarqueologico.com
It's not 100% valid since it uses Flash.
Any comments will be appreciated.
Nice site! Looks good.
I thought I would comment on Flash and a few techniques on how one
would go about making it validate:
Technique 01: Use a Javascript method/function document.write the
Flash object.
Example site: http://www.hillmancurtis.com/
Example HTML: script type=text/javascriptRunFoo();/script
Example .js file: http://www.hillmancurtis.com/hc_web/js/food.js
( code: )
function RunFoo() {
document.write('object
classid=clsid:D27CDB6E-AE6D-11cf-96B8-44455354
codebase=http://download.macromedia.com/pub/shockwave/cabs/flash/
swflash.cab#version=6,0,29,0 width=400 height=300\n');
document.write('param name=movie
value=hc_web/index_page/portraits_conference.swf /\n');
document.write('param name=quality value=high\n');
document.write('embed
src=hc_web/index_page/portraits_conference.swf quality=high
pluginspage=http://www.macromedia.com/go/getflashplayer;
type=application/x-shockwave-flash width=400
height=300/embed\n');
document.write('/object\n');
}
( /code. )
Technique 02: Flash Satay Method:
http://www.alistapart.com/articles/flashsatay/
Technique 03: Flash Javay method:
(Post #3)
http://talkfreelance.com/thread125.html
Google search should yield more results for this method. Originated via
alistapart discussusion on the above Satay method, but the discussion
has been deleted/closed since the new ALA redesign. :(
It has been several months since I last looked-into this matter, so
other (better?) methods/techniques are probably floating around
cyber-space. I personally like the first technique. The Satay method
takes-away a lot of control a developer has when it comes to the Object
Parameters.
HTH,
Cheers,
Micky
__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] text appears only if window is resized!
On Nov 7, 2005, at 1:43 PM, David Agnew wrote: When http://www.vsi.cape.com/~dagnew/lib/foo.php is viewed in IE6 Win, all text within #content div appears only after the window is resized. Peekaboo bug maybe? http://www.positioniseverything.net/explorer/peekaboo.html __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] 'textured bckgrnd' layout
On Nov 7, 2005, at 7:57 PM, Patrick Roane wrote: Hey folks, I've been working w/pure css layouts for a little while now with great results. Resently, I took a look at: http://www.tirolskaizba.sk/en/ (which was submitted to http://www.cssbeauty.com/) and I'm curious about how to accomplish a similar layout that uses images in the same way that the above site does. The corners are nice and rounded etc. I know this has been done before, but I've never done this myself and think that I can build a nice design using a similar technique. I wish I could view the css file for this site! Thanks- Patrick It is just an image made in (I am assuming) Photoshop: http://www.tirolskaizba.sk/obrazy/header-sk.jpg http://www.tirolskaizba.sk/ti.css Hth, Micky __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Logical expressions
On Nov 5, 2005, at 11:24 AM, Arjen Schwarz wrote: ...is there any way to set any relative measures in CSS like telling a div to set its bottom edge or height to the value of another element like another div who's bottom edge adjusts to the amount of content. Sounds like a job for Javascript You might find something interesting here: http://www.quirksmode.org/ m -- BCC for Privacy! http://www.cs.rutgers.edu/~watrous/bcc-for-privacy.html -- My del.icio.us: http://del.icio.us/mhulse __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] MY FIRST CSS LAYOUT (PLEASE CHECK FOR ERRORS)
On Nov 5, 2005, at 1:25 PM, Kalen Higton wrote:
Hello, I made two easy to troubleshoot layout pages. I will love
you long time if you could take a look and give me your thoughts/
suggestions.
www.kalenarts.com/tester1
www.kalenarts.com/tester2
tester2 was modeled after the suggestions from the following website.
http://www.456bereastreet.com/lab/developing_with_web_standards/
csslayout/2-col/
If anyone would like to see the website the tester pages are
implemented in, please go to:
www.globalexpeditionsinc.com
login: global
password: tenting
My goal: Display properly on the newer browsers.
I quickly tidied-up you CSS for tester2... I like to use shorthand:
#wrapper {
/* Shorthand for margin: top right bottom left, T-R-B-L. */
/* Below: If top and right valuse are same, you can shorten it to
this: */
margin: 0 auto;
width: 756px;
}
#maincontent {
/* Shorthand T-R-B-L works for other properties too: */
padding: 5px 0;
/* No need to specify unit for 0: */
margin: 5px 0;
width: 450px;
}
#list {
/* EMs or % for font size would probably be better choice. Start
getting used to them now and save you some headache later: */
font: normal 1.2em Verdana, Arial, Helvetica, sans-serif;
/* Font color shorthand: If all are same (#33) you can use #333,
If (#996633) you can use #963 */
color: #333;
/* padding-right: 10px; */
/* T-R-B-L: */
padding: 0 10px 0 0;
/* margin-right: 0px; */
margin: 0;
}
#rightcontent {
/* Set the border for all sides: */
border: 1px solid #666;
/* And then set the width for only the left using T-R-B-L: */
border-width: 0 0 0 1px;
padding: 0 0 0 10px;
margin: 10px 0 10px 5px;
width: 200px;
float: right;
}
#footer {
/* Font shorthand (Again, using EMs): */
font: normal .9em Verdana, Arial, Helvetica, sans-serif;
text-align: center;
/* Remove unit: */
padding: 0;
/* You had this as shorthand, looks good, just remove the unit from
the 0 value: */
margin: 0 auto;
width: 756px;
}
.style1 {
/* Using EMs... I am just making a guess at what 16px would be in
EMs... It all depends on how you go about things...
/* This is good site to visit:
http://www.thenoodleincident.com/tutorials/box_lesson/font/index.html
*/
font: normal 1.2em Verdana, Arial, Helvetica, sans-serif;
/* Shorthand: */
color: #333;
}
.style2 {
/* Percents are also a good option: */
font: normal 200% Verdana, Arial, Helvetica, sans-serif;
/* Shorthand: */
color: #333;
}
.footer {
font: normal .9em Verdana, Arial, Helvetica, sans-serif;
}
/* More could be done to stream-line your CSS, but this should give you
enough to chew on for now. */
--
BCC for Privacy!
http://www.cs.rutgers.edu/~watrous/bcc-for-privacy.html
--
My del.icio.us: http://del.icio.us/mhulse
__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] question on layout and Mac check please
I made a typo... see below:
On Nov 4, 2005, at 3:15 PM, Michael Hulse wrote:
I ussually do this for my sites:
* html {
margin: 0;
padding: 0;
}
That should have been:
/* Zero-out margins and padding for all elements: */
* {
margin: 0;
padding: 0;
}
Not that it matters... hehe...
m
--
BCC for Privacy!
http://www.cs.rutgers.edu/~watrous/bcc-for-privacy.html
--
My del.icio.us: http://del.icio.us/mhulse
__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Wierd color display IE/Firefox
On Nov 4, 2005, at 10:00 AM, Andreas Håkansson wrote: I did a bit more investigation and it appears the anomaly disappears if I change the background image file format from png to gif. Is this another one of the “Internet Explorer sucks at png rendering” issues? I just recently switched from using gif file to png and have not yet grasped all of the consequences. PNG does have troubles matching-up colors... not just PC, but on Mac too. I try to use GIF or .JPG whenever possible. A couple links that may help: http://www.sitepoint.com/forums/showthread.php?t=184597 (See post #3) http://www.sitepoint.com/forums/showthread.php?t=187929 M -- BCC for Privacy! http://www.cs.rutgers.edu/~watrous/bcc-for-privacy.html -- My del.icio.us: http://del.icio.us/mhulse __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Header's inline display and alignment
On Nov 4, 2005, at 10:27 AM, Adriano Castro wrote: Hi, I want to have, aligned to the left, a title followed by a sub-title. Then, on the same line as the sub-title, I want to have, aligned to the right, a date. Lastly on the next line, also aligned to the right a link. Something under these lines: Title Subtitle date link You might want to look into styling a definition list. Some links that may (or may not) help: http://www.scottmcdaniel.com/?p=33 http://aerie.chirp.com.au/css/format-dl/ http://archivist.incutio.com/viewlist/css-discuss/21106 Using styling from example #2 via second link found above, what I might try is: dl dtTitlebr /Subtitle/dt ddDatebr /Link/dd dtTitlebr /Subtitle/dt ddDatebr /Link/dd dtTitlebr /Subtitle/dt ddDatebr /Link/dd dtTitlebr /Subtitle/dt ddDatebr /Link/dd /dl Above not tested, but I think if styled right, you would achieve the results you are looking for. M -- BCC for Privacy! http://www.cs.rutgers.edu/~watrous/bcc-for-privacy.html -- My del.icio.us: http://del.icio.us/mhulse __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Horizontal layout
On Nov 4, 2005, at 11:40 AM, András Bártházi wrote: Hi, Any ideas? Thanks for all your help, this was the most usable link: http://cssplay.co.uk/menus/centered2.html Bye, Andras All three menu examples align left on IE/Mac5.2. Beware of phantom links if you decide you want to fix it for the IE/Mac browser: http://www.l-c-n.com/IE5tests/phantom-links/ M __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Layer not showing in IE
On Nov 4, 2005, at 12:16 PM, Angela Trigg wrote:
Ok, one step forward-- had a position:relative in there that I took
out and
now it shows, but in IE only it's showing up to the right of the image
instead of on top of it. Here's the css:
#menulist {
height: 63px;
margin: 0px;
padding: 0px;
border-top: 1px solid #A30404;
border-bottom: 1px solid #A30404;
float: left;
position:relative;
cfif attributes.keyword eq hometop: 457px;/cfif
width: cfoutput#linewidth#/cfoutputpx;
}
#menulist .mainnav {
height: 63px;
visibility: visible;
float: left;
display: inline;
left: 0px;
float:left;
width: 125px;
z-index:1;
padding: 0px;
cfif attributes.keyword eq homefilter:alpha(opacity=80);
-moz-opacity:.80;
opacity:.80; /cfif
background-repeat:no-repeat;
}
.menupopup {
position: absolute;
width: 125px;
height: 63px;
bottom: 0px;
margin: 0px;
padding: 0px;
visibility:hidden;
}
.menupopup ul {
position: absolute;
width: 105px;
bottom: 54px;
margin: 0px;
padding: 10px;
list-style-type:none;
}
.menupopup ul li {
font-family: Optima, Arial, sans-serif;
font-size: 12px;
font-style: normal;
line-height: normal;
color: #FF;
text-indent:0px;
height: 16px;
width: 105px;
padding: 2px;
border-bottom: 1px solid #fff;
text-align: center;
display: block;
}
.menupopup a { display: block; height: 16px;}
__
I am on a mac, and the menu seems to work ok With that said, it
would be hard for me to test code... Anyway, here is a bit of code I
use for a horizontal drop-down menu (based on Suckerfish):
#mainMenu li ul {
text-transform: none;
display: none;
position: absolute;
top: 100%;
left: 0;
z-index: 100;
}
#mainMenu liul { /* to override top and left in browsers other than
IE, which will position to the top right of the containing li, rather
than bottom left */
/*top: auto;*/
left: auto;
}
The above css is for the drop-down part of the menu... I am guessing
reversing the values to make it pop-up and incorporating it into your
css may help you squash you IE probs.
Here are some screen grabs from the Mac world:
(IE 5.2:)
http://www.ambiguism.com/CSSD/IEmac52cmmi.jpg
http://www.ambiguism.com/CSSD/IEmac52cmmi2.jpg
(Safari:)
http://www.ambiguism.com/CSSD/Safaricmmi.jpg
(Firefox:)
http://www.ambiguism.com/CSSD/Firefoxcmmi.jpg
Hth, good luck!
M
--
BCC for Privacy!
http://www.cs.rutgers.edu/~watrous/bcc-for-privacy.html
--
My del.icio.us: http://del.icio.us/mhulse
__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Using background-image PNGs in IE
On Nov 4, 2005, at 12:55 PM, Christopher Brown wrote:
I'd like to somehow shoehorn it into an ID or class:
div#image {background-image: url(../images/image.png);}
Does anyone know if this is this even possible without using script?
I'm tired of waiting for IE7 to come out.
Dunno, this might help:
http://www.pmob.co.uk/temp/transparent-test3.htm
M
--
BCC for Privacy!
http://www.cs.rutgers.edu/~watrous/bcc-for-privacy.html
--
My del.icio.us: http://del.icio.us/mhulse
__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] vertical alignment of text fields with other elements - I'm stuck!
On Nov 4, 2005, at 1:14 PM, Don Hinshaw wrote:
Hi list,
I am trying to vertically align a text field with two adjacent
elements:
a graphic label and a graphic button.
The working page is here:
http://test.hinshawdesign.com/css/slpl/cluster_masthead_v2.html
Here is what it should look like:
http://test.hinshawdesign.com/css/slpl/masthead_sample.jpg
Here are the problems that I have seen so far:
1. Safari: the text field is dropping down so it is partially outside
the green area
2. IE6/ Win 2K: The green box is expanding vertically to become too
tall
3. Opera 8.5/Win2K: the three elements are all dropping down in the box
so they are no longer aligned with the words Steedman Exhibit
I would highly suggest that you use a label for your text field... any
reason why you are using an image? The search.gif looks like regular
web text... I would use CSS to style the label... Here is some code I
use for one of my sites:
#yourDiv label {
font: normal .8em Arial, Helvetica, sans-serif;
color: #666;
text-align: right;
padding: 0 1em;
width: 175px; /* Use to move most form content left/right on
page. */
float: left;
clear: left;
}
/* Set the width for 'input' elements: */
#yourDiv input {
color: #333;
border: 1px solid #555;
border-bottom: 1px solid #ccc;
border-right: 1px solid #ccc;
padding: 1px;
width: 150px;
}
label for=searchSearch:nbsp;/labelinput type=text value=
name=search id=search maxlength=100 /
Also, I would make your logo a background image rather than a
transparent gif. Makes things a bit more simple.
Hopefully the above css does not confuse you... You may even be able to
get away with something as simple as:
#yourDiv label {
font-size: 10px;
color: #333;
}
#yourDiv input {
width: 125px; /* Width of input items in #yourDiv */
border: 1px solid #999;
border-bottom: 1px solid #333;
border-right: 1px solid #333;
}
Hth,
Micky
--
BCC for Privacy!
http://www.cs.rutgers.edu/~watrous/bcc-for-privacy.html
--
My del.icio.us: http://del.icio.us/mhulse
__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] question on layout and Mac check please
I am on Mac, so I do not see this border you talk about... here are
some screens from the Mac world:
Safari:
http://www.ambiguism.com/CSSD/sharemycodeSafari.jpg
IE5.2:
http://www.ambiguism.com/CSSD/sharemycodeIEMac.jpg
Firefox:
http://www.ambiguism.com/CSSD/sharemycodeFFMac.jpg
I do notice that you wrapped a form around your content... not sure
why... but, you might want to zero out your margins:
form {
margin: 0;
padding: 0;
}
I ussually do this for my sites:
* html {
margin: 0;
padding: 0;
}
And then I add padding or margin as needed.
HTH,
Micky
On Nov 4, 2005, at 3:05 PM, Francesco Sanfilippo wrote:
Two questions actually...
1. Why does the following layout have a small white border in IE 6,
but not in FF 1.5?
2. Could someone check this on Mac IE as well as Safari? Thanks!
http://sharemycode.com/test1.aspx
Francesco
__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] I want to scream
On Nov 4, 2005, at 3:05 PM, Angela Trigg wrote: Been developing in Firefox like a good little CSS newbie, and am making the tweaks necessary to make it work in IE6/WIN (which feels like trying to put a rubix cube together). I felt like I was so close, until I just took a look at it in Netscape 7! I feel like throwing the towel in and going back to tables--- seriously-- I can code sites so fast that way because I've been doing it for so many years, can someone give me a reason to stick it out given all the hacks you have to do, etc? I hate to have to go back because I've invested hours and hours and hours into trying to get this to work using just CSS. Here's my site: http://cmmi.trgsoftware.com Some links that may help: (Check the Popups section:) http://www.brunildo.org/test/index.html (Demo at bottom of page:) http://www.udm4.com/demos/horizontal-relative-dropup.php Just doing a search on google for CSS dropup menu. Ussually when I have a lot of troubles I like to re-think the way I am coding... Maybe you should not use any PVII scripts/code? I am assuming that you are using something from www.projectseven.com. I know that is not much help, but not sure what else I can offer you. Good luck, Micky __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] I want to scream
On Nov 4, 2005, at 3:34 PM, Michael Hulse wrote: On Nov 4, 2005, at 3:05 PM, Angela Trigg wrote: Been developing in Firefox like a good little CSS newbie, and am making the tweaks necessary to make it work in IE6/WIN (which feels like trying to put a rubix cube together). I felt like I was so close, until I just took a look at it in Netscape 7! I feel like throwing the towel in and going back to tables--- seriously-- I can code sites so fast that way because I've been doing it for so many years, can someone give me a reason to stick it out given all the hacks you have to do, etc? I hate to have to go back because I've invested hours and hours and hours into trying to get this to work using just CSS. Here's my site: http://cmmi.trgsoftware.com Some links that may help: (Check the Popups section:) http://www.brunildo.org/test/index.html (Demo at bottom of page:) http://www.udm4.com/demos/horizontal-relative-dropup.php Just doing a search on google for CSS dropup menu. Ussually when I have a lot of troubles I like to re-think the way I am coding... Maybe you should not use any PVII scripts/code? I am assuming that you are using something from www.projectseven.com. I know that is not much help, but not sure what else I can offer you. Good luck, Micky I say [I am] not sure what else I can offer you in my previous response because working with CSS and popup menus (speaking from experience) is a bitch (esp. when javascript is involved). An alternative would be to feed netscape something watered-down... you know, like a menu that has all of the popups expanded, or an alternative layout that is not as complex and coded in a way that is not problematic. Attacking your problem in this way may save you a ton of headaches. If you are using PVII scripts/code, have you checked the www.projectseven.com support forums? http://www.projectseven.com/support/ A couple more links that may help: http://www.cssplay.co.uk/menus/index.html http://www.pmob.co.uk/ __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] vertical alignment of text fields with other elements - I'm stuck!
Michael Hulse wrote:
Also, I would make your logo a background image rather than a
transparent gif. Makes things a bit more simple.
Hopefully the above css does not confuse you... You may even be able
to
get away with something as simple as:
#yourDiv label {
font-size: 10px;
color: #333;
}
#yourDiv input {
width: 125px; /* Width of input items in #yourDiv */
border: 1px solid #999;
border-bottom: 1px solid #333;
border-right: 1px solid #333;
}
Thanks for the suggestions, but I'm not really sure that it addresses
the problem of trying to get all the elements to align along a single
horizontal axis.
Well, I was just trying to point out a few issues in hopes that others
might chime-in on the rest of your problems
See: http://test.hinshawdesign.com/css/slpl/cluster_masthead_v3.html
Now it no longer renders correctly in FF.
I may have possibly misunderstood your direction...
Here is a real quick mockup I did for you:
http://www.ambiguism.com/CSSD/steedman/
Obviously the logo should be replaced... It is not a perfect layout,
but it should get you going in right direction. I ended up using
padding to align the elements... There may, and probably is, a better
way... I am sure there is a good hack for vertical-alignment...
although:
http://www.sitepoint.com/forums/showpost.php?p=1239968postcount=5
As to the idea of using a background image for the logo, I know this is
a bit OT, but would you suggest that a logo is not content? Especially
in the case of a type-based one, I would think it would be.
OT?
Yeah, sure, you make a good point. I could go either way, it really
depends on the design for me. I was just trying to make suggestions
that would make it easier on you.
Thanks,
Don
Again, I slapped that layout together very fast, so not bug tested, and
probably could be done way better, but for now it should get you going
in right direction.
Cheers,
Micky
--
BCC for Privacy!
http://www.cs.rutgers.edu/~watrous/bcc-for-privacy.html
--
My del.icio.us: http://del.icio.us/mhulse
__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Body Background issue
On Nov 4, 2005, at 7:29 PM, Kenoli Oleari wrote:
I'm working on a MacIntosh system.
I notice that when I use the style:
body {
background-image: url(assets/bottom_image.gif);
background-repeat: no-repeat;
background-position: bottom center;
}
It is rendered differently in different browsers.
Safari puts it at the bottom where it is supposed to be.
Firefox puts it about 15% down the page from the top.
Internet Explorer sort of tiles it, but in some kind of messed up up
way sarting about half-way down the page and creating overlapping
tiles.
What's up. All the resources I've read indicate that all current
browsers should render background styles correctly.
Example page?
Maybe try using units instead of keywords:
background: url(assets/bottom_image.gif) no-repeat scroll 100% 50%;
Prob wont help, but worth a try... Post a link if you can.
Micky
--
BCC for Privacy!
http://www.cs.rutgers.edu/~watrous/bcc-for-privacy.html
--
My del.icio.us: http://del.icio.us/mhulse
__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] List item hover issue
On Nov 4, 2005, at 8:14 PM, Jonathan Carter wrote: I'm designing a test page right now and have run into an odd issue with my top navigation. It's implemented as an unordered list and works fine until you mouse over one of the list items in which each item seems to convert into block elements and ruin the layout. I'm not very strong in CSS design so any help would be appreciated. Also if someone could briefly help me to understand how and when to effectively use em units in setting element margins, ect. I get it's application in text sizes but not so much in page layout design. The page can be viewed at the following URL: http://www.epiphanize.com/ Thanks again. Note: I realize the above page looks like garbage, but it was thrown together in about an hour as practice. Sorry, I do not have time to look things over... but, I would suggest you check these sites: http://css.maxdesign.com.au/listamatic/ http://www.l-c-n.com/IE5tests/phantom-links/ http://www.cssplay.co.uk/menus/index.html http://www.pmob.co.uk/ http://www.alvit.de/handbook/ And do not forget to validate: http://validator.w3.org/check?uri=http%3A%2F%2Fwww.epiphanize.com%2F http://jigsaw.w3.org/css-validator/validator? uri=http%3A%2F%2Fwww.epiphanize.com%2FApp_Themes%2FDefault%2FDefault.css usermedium=all You might have better luck finding some code via listamatic and tweaking that code to suit your needs instead. Other than that, I am sure one of the CSS gurus on this list will give you the answers you need. Good luck, Cheers, Micky -- BCC for Privacy! http://www.cs.rutgers.edu/~watrous/bcc-for-privacy.html -- My del.icio.us: http://del.icio.us/mhulse __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
[css-d] [CSS hack/filter] Targeting IE5.0/PC only...
Hello,
I only want to target IE5.0/PC only. I also want to do it inline with
the rest of my styles.
Would something like this do the trick:
/*\*/
#nv ul li a {
float: right;
float/* */:/**/:none;
float:none;
}
/**/
I tried the above, but it appears as though the 3rd/last property/value
overrides the previous two. :(
Any ideas?
Thanks in advance,
Micky
--
BCC for Privacy!
http://www.cs.rutgers.edu/~watrous/bcc-for-privacy.html
--
My del.icio.us: http://del.icio.us/mhulse
__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] IE-Transparency with CSS
On Nov 2, 2005, at 12:57 PM, Abyss Information wrote:
I hate IE transparency, is there anyway to be able to set the PNG
transparency in IE 6 without affecting the validation of a document or
CSS?
I use:
* html #yourDiv {
filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src='./img/
logo.png',sizingMethod='scale');
}
Not valid, but whatevah... I aint that anal. ;)
--
BCC for Privacy!
http://www.cs.rutgers.edu/~watrous/bcc-for-privacy.html
--
My del.icio.us: http://del.icio.us/mhulse
__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] DIV question
I need the DIV to expand to the ends of the image width, but I do not want the text below the image to extend past the edges of the image (sort of like a newspaper inset). Are you able to get the width of the image dynamically? I have used PHP to do exactly what you want: Dynamically grabbing the width of the incoming image and applying that width to the containing div... worked pretty good for a gallery script... Not sure if this will help (probably not) but I thought this was a cool way to align text with image using DT: http://www.maxdesign.com.au/presentation/definition/dl-image-gallery.htm m -- BCC for Privacy! http://www.cs.rutgers.edu/~watrous/bcc-for-privacy.html -- My del.icio.us: http://del.icio.us/mhulse __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] [CSS hack/filter] Targeting IE5.0/PC only...
Hello Michael,
/*\*/
#nv ul li a {
float: right;
float/* */:/**/:none;
float:none;
}
/**/
This should be very unreliable in the future. Why don't you just use a
conditional comment?
I do this in all my templates:
!--[if lt IE 7]
link rel=stylesheet type=text/css href=ie-5-6x.css /
![endif]--
!--[if lt IE 6]
link rel=stylesheet type=text/css href=ie-5x.css /
![endif]--
!--[if lt IE 5.5000]
link rel=stylesheet type=text/css href=ie-50.css /
![endif]--
!--[if IE 5.5000]
link rel=stylesheet type=text/css href=ie-55.css /
![endif]--
!--[if IE 6]
link rel=stylesheet type=text/css href=ie-6x.css /
![endif]--
!--[if IE 7]
link rel=stylesheet type=text/css href=ie-7x.css /
![endif]--
This is completely save - also in the future. Now you can do whatever
you like in ie-50.css.
Sascha Ebach
Hi, thanks for such a quick response! :) I really appreciate your time.
You have sent me some great info. And I probably will head that
direction.
I was just looking for a quick and dirty fix... For just one small
hack, I wanted to avoid separate style sheet.
I thank you for sharing your technique. :) Very helpful.
Cheers,
Micky
--
BCC for Privacy!
http://www.cs.rutgers.edu/~watrous/bcc-for-privacy.html
--
My del.icio.us: http://del.icio.us/mhulse
__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Height:100% problems
On Nov 3, 2005, at 5:20 PM, Josh McDonald wrote: Is there any way to have a div that's height:100%, but grows when the content is outside of the viewport? Why on earth is this difficult? http://www.sitepoint.com/forums/showpost.php?p=1243541postcount=8 That might help. You may also want to check here: http://www.cssplay.co.uk/index.html m -- BCC for Privacy! http://www.cs.rutgers.edu/~watrous/bcc-for-privacy.html -- My del.icio.us: http://del.icio.us/mhulse __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] [CSS hack/filter] Targeting IE5.0/PC only...
On Nov 3, 2005, at 6:13 AM, Gunlaug Sørtun wrote:
Michael Hulse wrote:
I only want to target IE5.0/PC only. I also want to do it inline with
the rest of my styles.
CSS filters are generally unsafe - except when used correctly to
separate dead browsers from the living.
IE6 and previous versions are dead, and can be filtered out safely.
CSS filter for IE5+/win only, targeting versions less than IE7.
Can be used in 'styles in page head' and 'external stylesheets'.
Must be used _complete with @media rule_, and put after all other
styles
so not to interfere with other @media rules if there are any. No
further
separation needed.
Example with your styles:
@media all {
* html #nv ul li a {
float: right /* IE5.0 + 5.5 + 6 win */;
float/**/: none /* IE5.5 win */;
fl\oat: none /* IE6 win */;
}
}
...safe filter if later versions than IE6 are set to run in 'standard
mode', according to the Microsoft IE7 team.
regards
Georg
--
http://www.gunlaug.no
h that filter works really well. THanks!
--
BCC for Privacy!
http://www.cs.rutgers.edu/~watrous/bcc-for-privacy.html
--
My del.icio.us: http://del.icio.us/mhulse
__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Width:100% and padding?
On Nov 3, 2005, at 8:23 PM, Josh McDonald wrote: Following up, my problem is that width:100% on the containing div seems to be ignored. What should I look for that could trigger that? -Josh -Original Message How on earth do I push a div out to 100% when it's padded, if the contents aren't wide enough? -Josh Should not a div (block) expand to 100% automatically? Not sure if I am understanding your question. You got any code we can gander at? m -- BCC for Privacy! http://www.cs.rutgers.edu/~watrous/bcc-for-privacy.html -- My del.icio.us: http://del.icio.us/mhulse __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
[css-d] How can I center this menu:
Hello all, I have been having a heck of a time trying to figure out the best way to center this menu: http://www.l-c-n.com/IE5tests/phantom-links/inline-block_list.php The above menu works nicely in IE5 mac (avoids phantom links), Safari/Mac, Firefox/Mac, IE 5.5+/PC Any help would be greatly appreciated. :D Cheers, Micky -- BCC for Privacy! http://www.cs.rutgers.edu/~watrous/bcc-for-privacy.html -- My del.icio.us: http://del.icio.us/mhulse __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
