Re: [css-d] Site Check - IE6
On 7/13/07, Don Stefani [EMAIL PROTECTED] wrote: HI, I could use a confirmation that this site: www.sunsetmusic.biz is not showing bad floats in IE6. I can confirm on IE6 / Windows 2000 that it looks correct. Brian __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7 information -- 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] prevent drop-downs from sticking?
On 7/12/07, Mary Jo Sinner Savageau [EMAIL PROTECTED] wrote: http://ecologic.taopowered.net/templates/index1.htm -- to see the problem, click on any of the top menu items except the two at the far right Hi Mary Jo, I am unable to reproduce this effect in either Firefox 2 or IE 6. Can you please tell us what browser and version you are seeing this happen in? Thanks, Brian __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7 information -- 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] prevent drop-downs from sticking?
On 7/12/07, Mary Jo Sinner Savageau [EMAIL PROTECTED] wrote: Yes, IE7 Hi Mary, I'm not 100% positive; but I believe this is describing a fix for the problem you're experiencing: http://www.builtfromsource.com/2006/10/23/a-fix-for-suckerfish-dropdowns-in-ie-7/ __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7 information -- 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] CSS Menu not Layering over Flash
On 7/9/07, Ricky Zhou [EMAIL PROTECTED] wrote: As a side note, the wmode attribute isn't supported in Firefox on Linux at all (https://bugzilla.mozilla.org/show_bug.cgi?id=137189). Interesting that you should post that as the next day it was marked as FIXED in Bugzilla https://bugzilla.mozilla.org/show_bug.cgi?id=137189 Adobe will have to make a slight modification to their Flash plugin for Linux, but it seems we will finally get wmode support there. Brian __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7 information -- 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] double border-style in IE7
On 7/10/07, Jukka K. Korpela [EMAIL PROTECTED] wrote: In your case, it seems that there is a simple way: wrap the element div id=main.../div inside an outer div, and set the outer div's background color to the desired value (white, in this case). An alternative solution (also using nested divs) would be to set the border of your current div to 1px solid, add an inner div with a transparent background, 2px margins, and a 1px solid border as well. I'm not sure which method is preferable--I had actually typed my method above before Jukka's email arrived in my inbox. I think Jukka's might win out simply because available (inner) size and occupied space would not change from what you'd expect using a double border. Thanks also for pointing out that the specs had no clarification on which method is considered correct. Brian __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7 information -- 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] Changing the tiling starting point?
I have a need to change the starting point of a tiled image. See this CSS: #element{ background: url(../images/inside_pg_bg.gif) repeat-y #000; background-position: 0 116px; } The desired effect would be to have the background be #000 until 116px down the page where the background image would begin and tile vertically from there forward. The actual effect is the image tiles as usual from top to bottom of the element. Is there any way of doing what I'm describing here? Thanks, Brian __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7 information -- 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] Best way for text when enlarged
That's a lot of great information arguing in favor of allowing for complete user control over text size and I'll be the first to say that I love the concept. However, the difficulty comes in reconciling that desire with the design at hand. Example: I have a fixed width design that is 760px wide and I need to put 5-tab navigation across the top. There is a finite amount of space to work with--allowing the text to expand beyond certain limits ends up breaking your layout. So does anyone have some suggestions, or perhaps even some URLs to discuss how to make these two concepts mesh? Thanks, Brian __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7 information -- 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] Best way for text when enlarged
On 6/21/07, David Laakso [EMAIL PROTECTED] wrote: Let's see what you've got. Provide a uri to your example. Best, ~dL Oh, I'm speaking in a purely academic sense here based on my experience of layouts that don't really account for text resizing (as an aside, I am not a designer, I work on an implementation team so I often don't have very much input into the visual design). I use em's almost exclusively; but only for the sake of allowing text to be resized and with the understanding that users changing that size will likely cause problems with the layout. The argument of many of the examples above is that we use 1em as our base size (typically 16pt font in IE or Firefox by default) and give full control to the user to change that text size as they see fit while at the same time repeating over and over that research shows that 12pt is the preferred font size of a majority of Internet users. With ems, we have to rely on the user setting to know where that base is--the default is 16pt. How many users have changed it? How many change it on every page they view until they come to the appropriate size for their needs? In any of these cases, designers must make some assumption about what users have done; the majority from what I've seen tend to leave the default font-size setting as it is; and we implement our pages based on that assumption--using ems or percentages to scale the 16pt default to the 12pt preferred size. By using ems, we do ensure that people are able to make the text larger--but many materials cited in this discussion say its still bad practice. Even as a believer in highly accessible design, I have to ask if there's a point where we've struggled to provide it to a degree that usability suffers--that is, can we grow so focused on serving the long tail that we forget about the beast its attached to? Brian __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7 information -- 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] Tricky layout: centred site with bg images stretching to the left
Hi Simone, Is something like this what you are trying to achieve? http://pfmoon.com/ This one was tricky for me and I came up with a less than perfect solution (but with the budget this client was working with, I couldn't hammer at it for hours to try to get something proper worked out). If this is the effect you're looking for, it might serve as a good starting point for implementing it. Brian __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7 information -- 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] Ideas for handling text with CSS
On 6/20/07, [EMAIL PROTECTED] [EMAIL PROTECTED] wrote: I was wondering if anyone has a link or information as how to best handle text with CSS. By text I mean a line of text that may include 3 pieces of information, like name, phone, and email address. I found a site that mentioned word-spacing, but that won't work because I don't want a large amount of spacing between the first and last name. Is the information you're trying to present best represented by a table? You may find that if you're listing several contacts, a contacts table might be the best way to do it. One pure CSS solution would look like this: pspanName/spanspanPhone/spanspanEmail/span/p p span{ display: block; float: left; margin: 0 10px; } But again, CSS isn't about eliminating tables--its about learning to use them only when the information you're presenting wouldn't be best presented in a table. Brian __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7 information -- 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] expandable menu woes again
On 6/20/07, Zoe M. Gillenwater [EMAIL PROTECTED] wrote: (You really should try to get your client to upgrade to IE 6 at least. Try telling them that their browser is several years old and thus vulnerable to lots of virus and spyware attacks. That usually works.) Good technique; and where I go here may be out of bounds--but I think it warrants discussion: is there a browser version you can point to and say look, I'm sorry, we just can't support that. In my opinion, IE 5.5 has not been standard issue since 2000 or early 2001 at the very latest; that is, it is at the very least 6-7 years old. I would hope, at this point, we can all agree that attempting to support Netscape 4.x (released 1998) or IE 4.x, and probably 5.x is just out of the question. But when is it reasonable for us to point to IE5.5, its broken box model, and its complete lack of support from Microsoft and say Nope, not doing it. Quite frankly, I'm already in that boat personally, but I do see a lot of people still considering it at this point and I really do wonder why. Brian __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7 information -- 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] Problem centering div
On 6/20/07, Lyn Williams [EMAIL PROTECTED] wrote: I have a problem centering a menu I have within a div. I have tried using many methods but I get no luck. have you tried: div#buttons ul{ width: XXXpx; margin: 0 auto; } where width is set equal to the menu's width? Brian __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7 information -- 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] Netscape problems
On 6/15/07, trevor bayliss [EMAIL PROTECTED] wrote: My page is validated but I am having problems with the ajax divs for some reason they mess up with netscape: Netscape 4.78 (no Flash) Windows 2000 Professional Netscape 6.2.3 (No Flash)Windows XP Netscape 6.2 (no Flash) Windows 2000 Professional Netscape 4.7x was released in 2000--and even then it was based mostly on the 4.x codebase that was released in 1998. Simply put; supporting AJAX technology wasn't even on the horizon. The Netscape 6.2 series was based on very early pre-release Mozilla code which was not at all ready for mass consumption; trying to support it in any modern setting is, as its 4.x predecessor, nearly impossible. It's (in a way) admirable that you are concerned with supporting as wide a variety of browsers as possible; but the browsers you are talking about just don't have support for modern websites and applications. Brian __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7 information -- 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] CSS Framesworks
On 6/14/07, Dave Goodchild [EMAIL PROTECTED] wrote: Not a serious HTTP issue as the stylesheets will be cached once downloaded. Also, if you're very concerned about minimizing requests, you can always create a script that concatenates your development files into one large file which is then included by the website. Just because its broken up in the development environment doesn't mean it has to be served up that way. Brian __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7 information -- 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] One bug left - Suckerfish Menu hides
On 6/12/07, Jörn Kretzschmar [EMAIL PROTECTED] wrote: Only as I hover over the link the submenu block is visibel. Why? It appears to be that your links in your first-level drop downs are not set to height and width at 100% and that you are using their hover event to activate the sub-level items. The effect I'm getting is that as soon as my mouse goes outside the link area, the 2nd level of the flyouts disappears. Try setting your a tags in there to include: a{ display: block; height: 100%; width: 100%; } to force them to expand to the size of their parent element which should, in theory, cause you not to go outside the link area. Brian __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7 information -- 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: WYSIWYGs and CSS?
On 6/7/07, Melissa Carraway [EMAIL PROTECTED] wrote: My problem is that this site is going to be edited by the client in Contribute. The site looks fine in Mozilla and in IE, but for some reason when I open it in Contribute, it doesn't work at all! The reason is that Contribute's HTML rendering while in edit mode is terrible--but only slightly worse than Dreamweaver. Some people try to say it operates similarly to IE6 in either quirks or standards mode--but neither is the case. That said, I have yet to find any 3-column solution which will render properly in Dreamweaver's design view or Contribute's editor. If your client needs a 3-column design and doesn't have any particular attachment to Contribute (which it doesn't sound like s/he does) consider yourself lucky and find a different means of content management. Brian __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7 information -- 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] IE6 fails with suckerfish nav with active state
Combining several techniques, I've created the top level navigation for this page here: http://demo.kelleninteractive.net/phii/www/test.html The images that are used for the navigation are structured as follows: http://demo.kelleninteractive.net/phii/www/images/nav_subjects.gif top: normal state middle: hover state bottom: active state Firefox2 behaves as expected, so you can view that page in Firefox 2.x to see the desired results. Here is a chunk of the relevant CSS (the code for 1 of the navigation items) #nav li#nav_programs{ background: url(../images/nav_programs.gif) no-repeat; width: 67px; } #nav li#nav_programs:hover, #nav li#nav_programs.sfhover{ background-position: 0 -43px; } #nav li#nav_programs.active{ background-position: 0 -86px; } IE6 will only process the first declaration. That is; the way it is set up now, the hover state will work correctly but the active state will not. If I declare the active state first in the css, the active state will work and the hover state will not. Any advice or help would be much appreciated; I've been beating my head against a wall on this one for about an hour. Brian __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7 information -- 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] Divitis?
Out of curiosity, why not use an unordered list--it would seem more semantically correct in this situation. You could change your div to a ul and wrap your items in li tags; then you can set the background of the the li tag to the image you want and position it appropriately. Brian __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7 information -- 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] USING RELATIVE AND ABSOLUTE POSITIONING
On 5/23/07, Jason Chan [EMAIL PROTECTED] wrote: This is the one and only thing i learned about these two properties, relative and positioning. are there any other things that you can do with them? Hi Jason, Perhaps the most commonly used feature available when relative or absolute positioning is used is the z-index. I use it most often when I have a transparent gif or png image that I want to overlap certain sections of the page; relative positioning allows me to move the element outside of the document's normal flow and z-index ensures that its always above the other elements. Here are a couple of URL's with some helpful information as to how each position type works; they should help get you started: Learn CSS Positioning in 10 Steps http://www.barelyfitz.com/screencast/html-training/css/positioning/ BrainJar.com: CSS Positioning http://www.brainjar.com/css/positioning/ Brian __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7 information -- 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] Simple design
Do you have URL's you could show us of: 1) What you're trying to replicate (the old tables version) 2) Your current attempt. They would be very helpful for us to get a clearer picture of what's going on. Thanks, Brian __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7 information -- 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] CSS Drop Downs over Flash
On 5/18/07, Zachary M. Berke [EMAIL PROTECTED] wrote: I'm trying to use z-index'ing to make some CSS drop downs ride over a Flash Movie. You will need to make sure the wmode of the movie in flash is set to transparent; that will allow the menus to render above the flash movie. This will work for both windows and the mac; however, it will not work under Linux. It is a known bug with flash for linux. Z-index won't affect it going over flash--the flash doesn't respect the layering rules of z-index. Brian __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7 information -- 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] enclosing a div in another one
On 5/18/07, James Gadrow [EMAIL PROTECTED] wrote: James Hague wrote: hi .. in an example like the one below .. how can one enclose the regContainer div inside the mainFrame div irrespective of the content of the regContainer. The clearer div is not doing the trick! a large content of 'regContainer' pushes its lower edge below the main frame! The issue here is that you've specified that .mainFrame is 100% of the height of the body. And, according to the display: block; specs content too large to fit within its container is supposed to spill out of the container by default (not that IE respects that spec but that's another issue). (truncated) Not sure exactly what you would like to happen but you can either remove the height property on your mainFrame (and thus allow it to expand to fit the content) but making your page scroll (which is normally accepted behaviour). Or you can apply another height to the .regContainer that fits terminates the border within .mainFrame and then set it's overflow property for whatever you would like to happen if the content spills off the page (presumably you would like the interior content to scroll and thus you would use overflow: auto). Alternatively, you can use the min-height property as opposed to the height property--that will make sure its 100% at minimum and still allow it to expand beyond that to contain other content. IE6 will not respect this, but it treats the height property as if it were the min-height property; so you could use the Holly Hack or conditional comments to include a declaration of height for IE only. As a side note; whenever I see someone declaring height 100%, I remind them that it doesn't work exactly like you might expect it to if you're thinking about old HTML table height. There's a pretty good explanation here: http://apptools.com/examples/tableheight.php Apologies if you were already aware--but I know its a common question. Brian __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7 information -- 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] Multiple elements changing on hover
Hi Jona, Change: #tracklist .track-desc h3:hover { color: #eb6810; } To: #tracklist a:hover h3 { color: #eb6810; } Tested here in IE6 and FF2/win Brian __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7 information -- 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] bottom image for list
On 5/17/07, coolman coolx [EMAIL PROTECTED] wrote: It works well with dots showing in Firefox and other browsers but it shows dash in IE based browsers so I created a dot image but am lost as to which style to use as I had already used the background image for the bullets. Is there a way I can do the border-bottom using image? You cannot use an image for a border; however, if you have an inner element, you could apply one of your necessary backgrounds to the outer and one to the inner as such: ul lia href=#First Item/a/li lia href=#Second Item//li /ul li{ background: url(bottom_dots.gif) left bottom repeat-x; } li a{ background: url(bullet.gif) no-repeat transparent; } Hope this helps, Brian __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7 information -- 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] help
On 5/16/07, Laurel-Lea [EMAIL PROTECTED] wrote: Can anyone tell me how to hyperlink a background image? You'd need to hide a text link in there like so: ul lia href=#Link Text/a/li /ul li{ /* set your background and other relevant styling here */ } li a{ display: block; width: 100%; height: 100%; text-indent: -999em; } The text indent should hide your text off the page and the background will appear linked. Hope this helps, Brian __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7 information -- 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] IE7 a la Dean Edwards
The main issue with something like this is it will harm; not hurt, your testing environment. Installed on your machine, you will get this more standards compliant version of IE. However, I would imagine you have to work with the assumption that 99% of IE users would not have this addon installed--and thus, your copy of IE would be useless for testing. As to the validity of the project itself--I can't speak on it because I've never tried it. Brian __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7 information -- 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] Padding Issue
On 5/17/07, Steve LaBadie [EMAIL PROTECTED] wrote: What do I need to do to make the padding work the same in both Firefox IE 6? .esu_news { padding: 10px 0px 0px 20px; } Ensure that you're using a proper doctype to put IE into standards mode and the box model should behave appropriately with respect to padding. The w3c maintains a valid doctype list here: http://www.w3.org/QA/2002/04/valid-dtd-list.html Brian __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7 information -- 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] z-index problem
On 5/17/07, Rick Pasotto [EMAIL PROTECTED] wrote: The problem is that the horizontal menu in the header is partially obscured by the header graphic resulting in a:hover not working in all the menu items. I made the graphic (currently with a temporary border) as narrow as I could with a tranparent background so that the header section (the darker blue bar and the white bar) could vary in width with the screen size. I used a z-index so that the points of the crown would show outside the containing box. HI Rick, When using z-index, the element to which you are applying that z-index must be positioned either relatively or absolutely. Try adding it to your a elements in the menu bar and it should bump them up (though you may have some other tweaks to do after you change the positioning to relative). Brian __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7 information -- 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] 3 column layout without absolute positioning
On 5/17/07, Andrew Gaffney [EMAIL PROTECTED] wrote: I am working on a redesign of an existing site, and I wanted to go with CSS for layout instead of the current table layout. The new design consists of a gray body background, a centered DIV with images positioned at the top and a black background that blends into the bottom of the images. Inside that, there's a centered content area DIV which has a white background and a border. But there's a few problems I've run into. After being continually frustrated with 3 column layouts and inconsistencies, I finally just decided to adapt to the 3 column templates provided at Dynamic Drive for my purposes when I needed to use them: http://www.dynamicdrive.com/style/layouts/ As a word of warning--these layouts work great in browsers but will look horrendous in the Dreamweaver design view or Adobe Contribute. If neither of those items are considerations, then I've found them to be a great resource. Brian __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7 information -- 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] font-size-adjust
On 5/17/07, Sam Carter [EMAIL PROTECTED] wrote: The example given clearly shows that the browser knows the x-height of Times New Roman to do the calculation. I don't see why a CSS coder should need to code the x-height of the first font, Verdana? Wouldn't it make more sense to simply enable or disable font-size-adjust? What am I missing? Sam Hi Sam, My understanding of the functionality is that it overrides the default behavior which would be as follows: body{ font-size 10px Verdana, Times New Roman; } In this case, if Verdana were not available, the font chosen would be Times New Roman at 10px. By using the font-size-adjust, you are able to compensate for the clear difference in perceived size between Verdana (which is readable at 10px) and Times New Roman (which is generally not readable at 10px). The font size (as you pointed out) would convert to between 12 and 13px for Times New Roman--a much more readable size. In this case, the browser knows the x-height of Times New Roman because the font is available whereas it does not have access to Verdana (if it did, font-size-adjust would be moot anyway) for x-height information. Brian __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7 information -- 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] font-size-adjust
On 5/17/07, Susan Grossman [EMAIL PROTECTED] wrote: I haven't been able to find a reference that lists the perceived size of the variety of system fonts so adjustments can be calculated. Do you know if there is one? I'd like to look further into this. Perceived size was my relatively lame way of trying to put characterize what the x-height would translate into from a user perspective. I don't have a listing of common font x-heights off the top of my head; but my guess is that someone else on the list will be able to chime in and fill in the gaps for us. Brian __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7 information -- 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] 100% height problems on Mac
On 5/16/07, Lee Powell [EMAIL PROTECTED] wrote: Hi Georg Unfortunately that doesn't seem to fix it when I test it in Safari or Firefox on a mac... Any other ideas? From what I understand, this is correct behavior for height: 100%. Setting height to 100% defines it to equal 100% of its container. Inheritance for this item would be: Browser html 100% body 100% element 100% Thus, 100% in this case equal 100% of the height of the browser window. This is not a bug, it is per the specifications and renders the same in Firefox PC: http://www.w3.org/TR/REC-CSS2/visudet.html#the-height-property Brian __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7 information -- 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] I'd like to create a splash page?
I'd like to tell you this is impossible as (for many reasons) splash pages are overall a bad idea. A couple of references: http://webdesign.about.com/od/navigation/a/aa020303a.htm http://www.websiteoptimization.com/speed/tweak/splash/ (just happened to come up at the top of Google searches, I'm sure there are even better resources out there). However, as I understand that there are clients out there who demand this sort of thing no matter how much we as designers and developers try to talk them out of it, I will say that the solution will rely in javascript which (I'm not sure as I'm new today) would be outside the scope of this mailing list discussion. I will say that you should look into the code for Lightbox as I'm sure it's layer technique could be easily adapted to create a splash page effect. Brian __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7 information -- 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] remove input border via css?
On 5/15/07, Del Wegener [EMAIL PROTECTED] wrote: I have not been able to Google any useful way to eliminate the scrollbar other than to color it the same as the page background. And that seems to work only for IE. How can I eliminate the vertical scrollbar on a textfield.? I'm not sure I'm understanding--do you want to hide: 1) an input type=text? 2) a textarea? 3) The scrollbar from a textarea? For 1 and 2, you can simply use display: none to prevent them from displaying. For #3, I'm not sure if there is a way to not display the scrollbar in a textarea. Someone else will have to comment. __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7 information -- 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] 2 questions
On 5/15/07, Lauri Pantos [EMAIL PROTECTED] wrote: Hi. #1 what would be the advantage of defining styles in the head instead of the body? #2 is it normal that the style info looks to be commented out, but still works? http://www.somtndesign.com/contactus2ak.htm Thanks Lauri Pantos Hi Lauri, The main advantage is actually to define your stylesheets in a separate file and link that file as such: link rel=stylesheet type=text/css href=/path/to/cssfile.css / This allows you to make one change and have it apply throughout all the pages of your site. The response to your second question is that what you're seeing is an HTML comment inside a stylesheet. HTML comments apply only to HTML code--stylesheet comments look like this: /* body{ background: #000; } */ The /* and */ open and close the comment in CSS. Hope this helps, Brian __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7 information -- 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] firefox display problems - need urgent help
Firefox 2.0.3 here; I don't see the problem you're referring to. Can you point to a specific URL URL where you're seeing the bug? __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7 information -- 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/