 |
 | Home | Contact Us | FAQ | Search & Site Map | Link to Us |
 | Sign In | Join | Other 45 Sites in Network |
| HomeDiscussion GroupsGeneralPHPASPPerlColdFusionFlashHTML, CSS, ScriptsBrowsers |
Webmaster Forum / HTML, CSS, Scripts / CSS / December 2007newbie: css width and height
So I'm trying to get my head round css and divs - updating previously table based websites to have css layouts. After banging my head against the wall trying to work out why netscape wasn't interpreting my box widths correctly, I installed firefox, read more about the box model and realised that its IE which isn't correct. So, box width and height refer to the content size, and the padding and margins are added to that. Ok. But in IE the box width and height are implemented as the whole box, and the padding is deducted from that (which actually makes more sense to me coming from a print background) I am inclined to design for the "correct" ie netscape and firefox interpretation, but my client uses IE so it's gonna look wrong. Any workarounds that aren't too hackish? Any help appreciated, please be very gentle with me :) Ruth > So I'm trying to get my head round css and divs - updating previously > table [quoted text clipped - 18 lines] > > Any workarounds that aren't too hackish? Some browsers allready support 'box-sizing': <http://www.quirksmode.org/css/box.html> So if you set up: * {box-sizing: border-box;-moz-box-sizing:border-box;} .. you've got more or less the same box-model behaviour.  SignatureRik Wasmus > So I'm trying to get my head round css and divs - updating previously table > based websites to have css layouts. [quoted text clipped - 12 lines] > I am inclined to design for the "correct" ie netscape and firefox > interpretation Yes do that. > , but my client uses IE so it's gonna look wrong. > > Any workarounds that aren't too hackish? > > Any help appreciated, please be very gentle with me :) I think if you use strict mode in IE it does box-sizing more or less correctly (i.e. box-sizing: content-box in CSS3 terminology, which means the width property sets the content area width not the outer border width). Get strict mode by starting each document with the strict doctype: <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"> > So I'm trying to get my head round css and divs - updating previously > table based websites to have css layouts. [quoted text clipped - 12 lines] > I am inclined to design for the "correct" ie netscape and firefox > interpretation, but my client uses IE so it's gonna look wrong. Are you using a valid doctype in your HTML documents? This will force IE6 and above into "standards mode", which includes the standard box model. IE versions < 6 will continue to misbehave and various 'box model hacks' exist to target these browsers (a very simple one is documented here: http://www.sitepoint.com/article/top-ten-css-tricks), but it's arguable whether it's worth catering to IE5.x any more. HTH Thanks everyone. I have actually now changed my doctype declaration, although that seems to have messed up some other stuff in IE. I will now work on the assumption that if it's right in IE but wrong in FF and NN, I've got it wrong :) It's really annoying, but I'm enjoying the flexibility I can get with css layouts. Well, would get, if IE didn't just do it's own thing... > Thanks everyone. > [quoted text clipped - 3 lines] > I will now work on the assumption that if it's right in IE but wrong in FF > and NN, I've got it wrong :) Most likely true. > It's really annoying, but I'm enjoying the flexibility I can get with css > layouts. Well, would get, if IE didn't just do it's own thing... Bane of web design. Design in FF, validate then tweak for IE. Sometimes rethinking your basic design so that 3 pixels does not matter. Google for "fluid web design" or "liquid web design", be more flexible a life web designer world get much easier when multiple browsers are involved. SignatureTake care, Jonathan ------------------- LITTLE WORKS STUDIO http://www.LittleWorksStudio.com >> Thanks everyone. >> [quoted text clipped - 13 lines] > "fluid web design" or "liquid web design", be more flexible a life web > designer world get much easier when multiple browsers are involved. One step at a time...remember I'm coming from print, where I know EXACTLY how everything will turn out :) I'm trying to do the right thing and render for all browsers and be accessible bla di bla bla...getting there, just requires changing the way I think completely! > One step at a time...remember I'm coming from print, where I know EXACTLY > how everything will turn out :) I'm trying to do the right thing and render > for all browsers and be accessible bla di bla bla...getting there, just > requires changing the way I think completely! Yes it is a very different mindset, but be patient and you'll get there. You've got the right attitude, which is half the battle. :) It also takes time and lots of practice to become proficient so don't expect miracles overnight. Keep it simple to start and don't sweat the small stuff. SignatureBerg Thanks! I think I'm getting there. I've created a page in which everything is positioned absolutely. So now my next step is to learn how to make a more flexible layout...but at least it looks the same in all (recent!) browsers and is miles better from the hash of table code that was previous. How do you guys check for old browsers like the old IE ones? Do you have copies of them installed or use some kind of emulator? Or is it just a matter of gaining experience in which browsers support what? Or (head hanging in shame) can I ignore ppls what use IE 5.5? >> One step at a time...remember I'm coming from print, where I know EXACTLY >> how everything will turn out :) I'm trying to do the right thing and [quoted text clipped - 8 lines] > expect miracles overnight. Keep it simple to start and don't sweat the > small stuff. > I've created a page in which everything is positioned absolutely. I cringe every time I hear that. It is usually one of the worst ways to lay out a web page. :( What happens when the visitor has a different window size than you? Larger text size? Different fonts? Unless you know what you're doing, absolutely positioned layouts do not adapt to such variations at all. At best it looks bad. At worst it's unusable. Chances are you don't need absolute positioning at all, you just haven't learned how to do it differently yet. If you post a URL we can better evaluate the situation. > How do you guys check for old browsers like the old IE ones? Search for 'multiple IE'. SignatureBerg You are 100% right....which is why I'm adjusting it now. But I only started learning DIVs and CSS on Monday so first I wanted to get my head around positioning with CSS, which was easier with absolute positioning, now I'm hoping to adjust it to be a bit more liquid. Actually it was good cos it helped me get my head around the css box model, which I actually find counter-intuitive especially in terms of the padding. (whoever heard of a box with the padding outside of it?) I cringe at the idea of posting this... (very fragile newbie!!) but here goes... Original table based website (yes, i know!) http://www.brianbarr.co.uk New css-ly structured version as above but add /testsite It's not finished yet - the links aren't in place, and there are a couple design bits I want to fix. Any suggestions welcome (but please be nice, I'm trying hard!) Thanks for all your help R >> I've created a page in which everything is positioned absolutely. > [quoted text clipped - 13 lines] > > Search for 'multiple IE'. > Original table based website (yes, i know!) > http://www.brianbarr.co.uk > New css-ly structured version > as above but add /testsite I don't have Verdana. Please read this: http://k75s.home.att.net/fontsize.html Test it yourself by removing Verdana from your font settings. It is unreadable. Oh, you don't have to assign font-family so often. Set it just once in the body. You have too much pixel-precision. Think about flexible design. On my wide-screen monitor, it's just a skinny column in the center. http://allmyfaqs.net/faq.pl?AnySizeDesign The icons on the right links look cartoonish to me. Oh, please don't top-post. Signature-bts -Motorcycles defy gravity; cars just suck >> Original table based website (yes, i know!) >> http://www.brianbarr.co.uk [quoted text clipped - 17 lines] > > Oh, please don't top-post. Thank you for your comments, constructive criticism appreciated. Now that I have (hopefully!) figured out the box situation with CSS I am redesigning the site to be more flexible (getting rid of as many absolutes as possible) - about half way through, I'll post it when I'm finished. With regard to the font declaration - I had a quick look at the document you recommended (will read properly on Monday!) - are you saying that the problem with verdana is the size? Isn't that the point of making the text resizable? I guess it's bad form to present the user with something they have to resize from the off. Still, even if I change the font, won't I always have the problem of finding a happy medium between all browsers / devices / resolutions? The client likes these icons but I take your point about the cartoonishness so will see if we can find something that everyone is happy with. All in all I'm still happier with this than the old table-based layout, which now I've used css seems a totally mad way of doing things. Have a good weekend. R >>> Original table based website (yes, i know!) >>> http://www.brianbarr.co.uk [quoted text clipped - 13 lines] > absolutes as possible) - about half way through, I'll post it when > I'm finished. Ok, great... ;-) Put the words "pixel precision" in the dumpster. > With regard to the font declaration - I had a quick look at the > document you recommended (will read properly on Monday!) - are you > saying that the problem with verdana is the size? Yes, it is an overly-large font, so developers are prone to reducing the font-size declaration to something way smaller; in your case, p { font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 75%; or only three-quarters of my preferred default size. You see, I do not have Verdana on my computer (nor Windows) so my browser attempts to match your fallback choices, ends up with Helvetica at flyspeck size (75%). You should drop Verdana completely, and use 100% for size for everything except headings and legalese. My page explains that and gives sample choices. > Isn't that the point of making the text resizable? Yes, resizable is good. If you used pixels instead of percentages for font size, all those Internet Exploder users would not be able to resize at all. > I guess it's bad form to present the user with something they have to > resize from the off. Eggzactly! If "100%" looks too large in your browser, or your client's, then you/they should probably adjust your/their own default size. > Still, even if I change the font, won't I always have the problem of > finding a happy medium between all browsers / devices / resolutions? The current recommendations are to give the visitor the choice, no matter what hir browsing situation. Oh, "resolution" is unimportant. You will have visitors using everything from wide-screen (1680px wide or more) to handheld devices limited to .. a couple hundred pixels. Opera and Firefox have "small-screen" simulators for testing. > The client likes these icons but I take your point about the > cartoonishness so will see if we can find something that everyone is > happy with. Very well. To me, the icons look like something I think I've seen on a British newspaper web site (forgotten which one). > All in all I'm still happier with this than the old table-based > layout, which now I've used css seems a totally mad way of doing > things. Yeppers. A good CSS layout is far easier to maintain than a table-based layout. Done correctly, you can change the entire appearance of a complete web site with just a few modifications in one CSS file. > Have a good weekend. Probably not. :-( Big snowstorm coming here in Upstate New York. Signature-bts -Motorcycles defy gravity; cars just suck In article <bzz8j.46469$MJ6.31134@bgtnsc05-news.ops.worldnet.att.net>, > Ok, great... ;-) Put the words "pixel precision" in the dumpster. One needs to be careful doing this. You would then have no means of reminding yourself not to crave pixel perfection, some of the crucial words needed would be missing. Signaturedorayme > "Beauregard T. Shagnasty" <a.nony.mous@example.invalid> wrote: > [quoted text clipped - 3 lines] > reminding yourself not to crave pixel perfection, some of the crucial > words needed would be missing. Precision, perfection ... potato, potahto ... Signature-bts -Motorcycles defy gravity; cars just suck In article <1MG8j.260886$kj1.106241@bgtnsc04-news.ops.worldnet.att.net>, > > "Beauregard T. Shagnasty" <a.nony.mous@example.invalid> wrote: > > [quoted text clipped - 5 lines] > > Precision, perfection ... potato, potahto ... Actually I was not splitting hairs about which words... or criticising your choices (which seemed fine to me). Nor against the advice not to be too concerned about pixels across browsers. No, my point was more to do with being careful not to throw the baby out with the bath water. Signaturedorayme >> Original table based website (yes, i know!) >> http://www.brianbarr.co.uk [quoted text clipped - 17 lines] > > Oh, please don't top-post. Thanks everyone for your comments. My next attempt - trying to make it more flexible, is it www.brianbarr.co.uk add /testsite/relative/ with some help from the new dreamweaver preset layouts. I have been messing and playing so I need to spend some time tidying up the css definitions - because i've been bringing in bits from the old sites and changing them...blabla, i just want to know if i'm on the right track. The one thing i can't seem to figure out is which tag to edit so that the header in the main content has a bit of space on top of it - everything i've tried doesn't work. I've tested it the very cool Adobe Device Manager (like a small device emulator) and it seems ok. What's the best way to work with images when designing a scalable layout? Like for example in the side bit ( I know there is an extra unneeded container there, need to sort that) I've put the image as a background in the css so that it can be ignored on a tiny screen - is that better than actually placing the image if the image is not actually adding any content? I've also updated the icons. When commenting please bear in mind that customer likes original layout, so I need to try stay as true to that as poss. R >> I don't have Verdana. Please read this: >> http://k75s.home.att.net/fontsize.html [quoted text clipped - 5 lines] > add > /testsite/relative/ I see: p { font-size: 85%; <-- Use 100% for content [1] font-style: normal; <-- Default; not needed ... a { text-decoration: none; <-- Force me to wave mouse around looking for links? [2] ... a:hover { text-decoration: underline; <-- Ahh. There they are. 1. If the content seems too large in your browsers, change your own preferred size to something you like, but don't mess with mine. Same applies to your client, if s/he thinks 100% is large. 2. There are two things surfers know how to do: click on links if they can find them use their Back button [3] If you change the default behaviour of these, you stand to lose visitors. 3. Breaks, if you open new windows. Signature-bts -Motorcycles defy gravity; cars just suck >>> I don't have Verdana. Please read this: >>> http://k75s.home.att.net/fontsize.html [quoted text clipped - 11 lines] > font-size: 85%; <-- Use 100% for content [1] > font-style: normal; <-- Default; not needed mmm, not sure, it looks HUGE! don't i get any say from a design (rather than usability!) point of view :( > ... > > a { > text-decoration: none; <-- Force me to wave mouse around > looking for links? [2] Well I have no problems underlining the links, but I have used underlining to highlight the access keys on each link which looks the best out of everything I've tried, so what do you reckon? > ... > [quoted text clipped - 4 lines] > preferred size to something you like, but don't mess with mine. Same > applies to your client, if s/he thinks 100% is large. > 2. There are two things surfers know how to do: > click on links if they can find them [quoted text clipped - 3 lines] > > 3. Breaks, if you open new windows. um, sorry to be thick...but what do you mean? Ruth ps - new icons - better? also still waiting for any info about why my content header is so close to the menu above. >> p { >> font-size: 85%; <-- Use 100% for content [1] >> font-style: normal; <-- Default; not needed > > mmm, not sure, it looks HUGE! You didn't read Note 1 below. > don't i get any say from a design (rather than usability!) point of > view :( If your visitors can't use it, what difference does the design matter? You are dispensing information, not fluff. >> a { >> text-decoration: none; <-- Force me to wave mouse around [quoted text clipped - 3 lines] > underlining to highlight the access keys on each link which looks the > best out of everything I've tried, so what do you reckon? Underline the links. Maybe use a different color on the accesskeys, or a double underline. >> a:hover { >> text-decoration: underline; <-- Ahh. There they are. You can also use a different color on hover. >> 1. If the content seems too large in your browsers, change your own >> preferred size to something you like, but don't mess with mine. Same [quoted text clipped - 6 lines] >> 3. Breaks, if you open new windows. > um, sorry to be thick...but what do you mean? Consider that a lot of people use maximized windows. A new window completely covers the existing one. There is no "Back" to go to. http://www.useit.com/alertbox/990530.html see point 2. I removed all your font sizing except the 90% on the right links, and on the headers. It becomes legible. That multiple-red menu box near the top was flyspecks prior to that. I also increased your max width from 48em to 60em. > ps - new icons - better? also still waiting for any info about why my > content header is so close to the menu above. Yes, they are better icons. What text do you mean by the 'content header'? Change your footer text size to 85%. Signature-bts -Motorcycles defy gravity; cars just suck >>> p { >>> font-size: 85%; <-- Use 100% for content [1] [quoted text clipped - 3 lines] > > You didn't read Note 1 below. Yes I did, I was just complaining about it. >> don't i get any say from a design (rather than usability!) point of >> view :( > > If your visitors can't use it, what difference does the design matter? > You are dispensing information, not fluff. Ok, you've made your point. Anyway, come on, what percentage of users can't see it AT ALL? >>> a { >>> text-decoration: none; <-- Force me to wave mouse around [quoted text clipped - 6 lines] > Underline the links. Maybe use a different color on the accesskeys, or > a double underline. Ok, underline links in content, but even our friend Nielson doesn't think that you have to underline navigational links. And I really do think those are obvious. >>> a:hover { >>> text-decoration: underline; <-- Ahh. There they are. [quoted text clipped - 16 lines] > > http://www.useit.com/alertbox/990530.html see point 2. Ah, I think I know what you mean. None of the links are in place yet (there is just a placeholder #) so if I understand what you mean correctly the problem is only temporary. > I removed all your font sizing except the 90% on the right links, and on > the headers. It becomes legible. That multiple-red menu box near the top > was flyspecks prior to that. I also increased your max width from 48em > to 60em. Ah, but 60em (as amended) has horizontal scrolling if someone is viewing the site at 800 x 600. So we can't have it all ways. >> ps - new icons - better? also still waiting for any info about why my >> content header is so close to the menu above. > > Yes, they are better icons. What text do you mean by the 'content > header'? Sorry, I meant the bit in the H1 tag (content header, as opposed to page header) which currently says "Brian Barr Solicitors are the leading firm for chronic pain and fatigue victims in England and Wales." This seems to be ok with a non-breaking space, but I'm sure there is a more elegant css way of doing it. > Change your footer text size to 85%. >> If your visitors can't use it, what difference does the design >> matter? You are dispensing information, not fluff. > > Ok, you've made your point. Anyway, come on, what percentage of users > can't see it AT ALL? There is no reliable way to discern that answer. How many blind people surf the web? >> Underline the links. Maybe use a different color on the accesskeys, >> or a double underline. > > Ok, underline links in content, but even our friend Nielson doesn't > think that you have to underline navigational links. And I really do > think those are obvious. If it looks like a menu, no, you don't have to use underlines. I was speaking about the links in the text. >>>> 3. Breaks, if you open new windows. >>> um, sorry to be thick...but what do you mean? [quoted text clipped - 7 lines] > (there is just a placeholder #) so if I understand what you mean > correctly the problem is only temporary. Opening new windows is a terrible idea. But my mention of it was only to show the "two things" that everyone knows. Clicking links, and using Back button. >> I removed all your font sizing except the 90% on the right links, >> and on the headers. It becomes legible. That multiple-red menu box [quoted text clipped - 3 lines] > Ah, but 60em (as amended) has horizontal scrolling if someone is > viewing the site at 800 x 600. So we can't have it all ways. So then set a left and a right margin and let it float to whatever the browser window size is, rather than attempt to make it a static size. I've a 22" widescreen (1680px) and my browsers are usually just a bit over half that wide. >>> ps - new icons - better? also still waiting for any info about why >>> my content header is so close to the menu above. [quoted text clipped - 9 lines] > This seems to be ok with a non-breaking space, but I'm sure there is > a more elegant css way of doing it. I still don't know what you mean. That text looks fine to me just as it is (last time I looked). >> Change your footer text size to 85%. ..as it is too small to read. Signature-bts -Motorcycles defy gravity; cars just suck >>> If your visitors can't use it, what difference does the design >>> matter? You are dispensing information, not fluff. [quoted text clipped - 4 lines] > There is no reliable way to discern that answer. How many blind people > surf the web? Right. So therefore it's a matter of finding a balance between having a site that looks right (and not too large!) for the majority of users and having something accessible, and I think the ability to resize the page would probably cover another sizable group, many of whom (who?), to be fair, are used to having to make some adjustments to surf the web. I'm not trying to be unkind or insensitive, only I don't want my website to look oversized, I'd rather provide the ability to adjust it. I think we might have to agree to disagree on this one, but I'll do some more research. >>> Underline the links. Maybe use a different color on the accesskeys, >>> or a double underline. [quoted text clipped - 5 lines] > If it looks like a menu, no, you don't have to use underlines. I was > speaking about the links in the text. Ah ok. Yes, I've changed that. >>>>> 3. Breaks, if you open new windows. >>>> um, sorry to be thick...but what do you mean? [quoted text clipped - 11 lines] > show the "two things" that everyone knows. Clicking links, and using > Back button. Ah ok, it'll be fine on the final version. >>> I removed all your font sizing except the 90% on the right links, >>> and on the headers. It becomes legible. That multiple-red menu box [quoted text clipped - 8 lines] > I've a 22" widescreen (1680px) and my browsers are usually just a bit > over half that wide. Ok, I'll have a go at that later. >>>> ps - new icons - better? also still waiting for any info about why >>>> my content header is so close to the menu above. [quoted text clipped - 12 lines] > I still don't know what you mean. That text looks fine to me just as it > is (last time I looked). I think I've fixed it with a space, that's why. >>> Change your footer text size to 85%. > > ..as it is too small to read. Yes, done that too. >>>> If your visitors can't use it, what difference does the design >>>> matter? You are dispensing information, not fluff. [quoted text clipped - 13 lines] > don't want my website to look oversized, I'd rather provide the > ability to adjust it. Since most of the people whose surfing habits I know are in my age group (think 'retired' people), I note that they appreciate not visiting sites with micro-text. These people might also be your prime visitors. Do young people with good eyesight often suffer from chronic pain? (Don't know... never had the pleasure. <g>) > I think we might have to agree to disagree on this one, but I'll do > some more research. Sounds like a plan. Just looked at your page again, and it is much better .. easier to read. The 60em width helps, too. <snip rest> Signature-bts -Motorcycles defy gravity; cars just suck <snip> > Since most of the people whose surfing habits I know are in my age group > (think 'retired' people), I note that they appreciate not visiting sites > with micro-text. These people might also be your prime visitors. Do > young people with good eyesight often suffer from chronic pain? (Don't > know... never had the pleasure. <g>) So all your sites are HUGE then ;) >> I think we might have to agree to disagree on this one, but I'll do >> some more research. [quoted text clipped - 3 lines] > Just looked at your page again, and it is much better .. easier to read. > The 60em width helps, too. Thanks for all your help. I do like this CSS stuff, I think I've learned a lot in the last couple of weeks, I shall keep at it. R > <snip rest> >> Since most of the people whose surfing habits I know are in my age >> group (think 'retired' people), I note that they appreciate not [quoted text clipped - 3 lines] > > So all your sites are HUGE then ;) No, my sites have anywhere from a dozen to a hundred pages ... oh wait, you meant my text! body { font-size: 100%; } takes care of it all. ;-) >> Just looked at your page again, and it is much better .. easier to >> read. The 60em width helps, too. > > Thanks for all your help. I do like this CSS stuff, I think I've > learned a lot in the last couple of weeks, I shall keep at it. CSS is quite powerful - and easy - once you get your brain wrapped around it. It's a new mindset, to be sure. Signature-bts -Motorcycles defy gravity; cars just suck > Right. So therefore it's a matter of finding a balance between having a site > that looks right (and not too large!) for the majority of users and having [quoted text clipped - 3 lines] > be unkind or insensitive, only I don't want my website to look oversized, > I'd rather provide the ability to adjust it. They already adjusted before they got there, possibly leaving no more adjustment range available to compensate for your rudeness. IE only allows 5 size choices, including normal and two sizes smaller than normal. If they've already gone up in size two steps and you knock it down, they can't get back to where they need to be. They shouldn't have to do it again on every site that thinks the visitor default is wrong. Your own default is wrong if you think it doesn't look right. http://mrmazda.no-ip.com/auth/bigdefaults.html Signature" Our Constitution was made only for a moral and religious people. It is wholly inadequate to the government of any other." John Adams Team OS/2 ** Reg. Linux User #211409 Felix Miata *** http://mrmazda.no-ip.com/ <snip> > They already adjusted before they got there, possibly leaving no more > adjustment range available to compensate for your rudeness. IE only allows [quoted text clipped - 7 lines] > think it doesn't look right. > http://mrmazda.no-ip.com/auth/bigdefaults.html man, you're late, i've already changed it. :) by the way your link points to a web page where the lines span the full width of the browser, which is even harder to read :) and i like my browser being full screen. This irritates me so much that i don't have the patience to read it right now. but thank you for your wise words, i will look at it when i'm back in work mode. happy holidays! >> http://mrmazda.no-ip.com/auth/bigdefaults.html > by the way your link points to a web page where the lines span the full > width of the browser, which is even harder to read :) and i like my browser > being full screen. This irritates me so much that i don't have the patience > to read it right now. One mouse click will switch most browsers between fullscreen and something less. Would you rather the lines be too short, something about which to correct one is virtually helpless? One has the option of making long lines short by sizing the window narrower. On this particular page in my browser, thanks to CSS3, the paragraph lines are only about 50 characters long, about 15cm or 9-10 words, even though my browser is about 90% of the width of my 16" wide screen. Maybe you could try a different browser, one that behaves the same as mine. There are at least two browsers I know of that do it. Both are free downloads, either or both of which are a proper part of a good web designer's toolbox. SignatureJesus Christ, the reason for the season. Team OS/2 ** Reg. Linux User #211409 Felix Miata *** http://mrmazda.no-ip.com/ >>> http://mrmazda.no-ip.com/auth/bigdefaults.html > [quoted text clipped - 19 lines] > of > which are a proper part of a good web designer's toolbox. I have a number of browsers installed, hactually. But anyway, suggesting that I change my browser? How does that fit into your "let the user choose" axiom? Hope you had a nice Xmas! :) R >>> http://mrmazda.no-ip.com/auth/bigdefaults.html > I have a number of browsers installed, hactually. Good. > But anyway, suggesting that I change my browser? How does that fit into your > "let the user choose" axiom? In the web design business, testing in multiple browsers is a necessity. When surfing, multiple shouldn't be necessary, but sometimes your choice on some particular page makes a BIG difference. Because of the CSS3 on the page, this is one of those cases. ;-) > Hope you had a nice Xmas! Just fine thank you!. Hope you did too. :-) SignatureJesus Christ, the reason for the season. Team OS/2 ** Reg. Linux User #211409 Felix Miata *** http://mrmazda.no-ip.com/ > "Beauregard T. Shagnasty" wrote in message: >> If your visitors can't use it, what difference does the design matter? >> You are dispensing information, not fluff. > Ok, you've made your point. Anyway, come on, what percentage of users can't > see it AT ALL? What's the point of telling your customers they are wrong? That's what you're doing by deviating the text size from the size they prefer, as set in their browsers. http://www.htmlhelp.com/feature/art2.htm >> I removed all your font sizing except the 90% on the right links, and on >> the headers. It becomes legible. That multiple-red menu box near the top >> was flyspecks prior to that. I also increased your max width from 48em >> to 60em. > Ah, but 60em (as amended) has horizontal scrolling if someone is viewing the > site at 800 x 600. So we can't have it all ways. That depends how big their default text size is. Not all ems are created equal, and in px, fewer are required to get legible text on the anachronistic 800x600. http://www.thecounter.com/stats/2007/December/res.php Signature" Our Constitution was made only for a moral and religious people. It is wholly inadequate to the government of any other." John Adams Team OS/2 ** Reg. Linux User #211409 Felix Miata *** http://mrmazda.no-ip.com/ >> "Beauregard T. Shagnasty" wrote in message: > [quoted text clipped - 10 lines] > their > browsers. http://www.htmlhelp.com/feature/art2.htm Ah.....Ha, why do I want to learn web design then, if it means I have to stop being right...? Graphic designers make a living telling customers that they don't know anything ;) but we do it in a really nice way. By the way, there IS a time to tell customers they are wrong. Like when they want flashing things. Scripty headlines, all in capitals. and bright yellow text on a red background. Oooh, and ugly pictures.... :) >>> I removed all your font sizing except the 90% on the right links, and on >>> the headers. It becomes legible. That multiple-red menu box near the top [quoted text clipped - 9 lines] > anachronistic > 800x600. http://www.thecounter.com/stats/2007/December/res.php correct, but i don't understand it well enough. i definitely have to learn more about ems and sizing before i can hope to have an objective conversation here. but i'm here to learn! Ruth > "Felix Miata" <UgaddaBkidding.due2UCE@dev.nul> wrote in message >> That depends how big their default text size is. Not all ems are created >> equal, and in px, fewer are required to get legible text on the [quoted text clipped - 4 lines] > more about ems and sizing before i can hope to have an objective > conversation here. but i'm here to learn! The above link can give a misleading impression. I gives the statistic of 1024x768 being the the most popular *screen resolution* on the web but that does not mean that 1024x768 or another dimensions represent the actually *viewport* by which the webpages are being viewed. My screen resolution is currently 1280x960 but my browser(s) are rarely maximized. In fact I'd wager the larger the monitor the less likely the browser will be maximized. Bottom line, do not design for any fixed viewport. SignatureTake care, Jonathan ------------------- LITTLE WORKS STUDIO http://www.LittleWorksStudio.com > (whoever heard of a box with the padding outside of it?) Hmmm. Virtually every time I buy stuff online that comes in boxes or other packaging, it goes into another bigger box - surrounded by - padding!!! :-) Padding is a layer between something and something else. As to any particular box, whether it is inside or outside is normally happenstance, but in the CSS standards, it looks like a choice was made for padding to make something take more space rather than stealing some space from a given amount of space. Makes sense to me. Signature" Our Constitution was made only for a moral and religious people. It is wholly inadequate to the government of any other." John Adams Team OS/2 ** Reg. Linux User #211409 Felix Miata *** http://mrmazda.no-ip.com/ >> (whoever heard of a box with the padding outside of it?) > [quoted text clipped - 6 lines] > more space rather than stealing some space from a given amount of space. > Makes sense to me. Yup, you can't get something from nothing. You either steal it from the content width (IE in Quirks) to get the padding you need, or steel it from the surrounding area and add it onto the existing content width (Standards Mode). [Not to mention the Border Width as well.] SignatureGus |
Reply to this Message |
 Sign In
 Join
 My Latest Posts My Monitored Threads My Blog My Photo Gallery My Profile My Homepage Start New Thread Enable EMail Alerts Rate this Thread
|
©2009 Advenet LLC Privacy Policy - Terms of Use
This website includes both content owned or controlled by Advenet as well as content owned or controlled by third parties.