In the following code...why is there a space between the two div's?? <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"> <html> <head> <meta http-equiv="content-type" content="text/html; charset=iso-8859-1"> <style> #header { background-color: cadetblue; } #footer { background: blue; } </style> </head> <body> <div id="header"> <p>This is my header.</p> </div> <div id="footer"> <p>This is my footer.</p> </div> </body> </html> Code (markup): If I remove the <p></p>'s from each sentence the spacing disappears. If I add a "border: 1px solid black;" to each style the spacing disappears. I don't want to know how to make it go away. I want to know why it's there? I mean shouldn't the paragraphs be fully enclosed inside the div's? Such that no spacing should appear between the div's? Any insight anyone might care to share with me would be most appreciated. Thanks. Carlos
its because of the default margin and padding impose by browsers adding a css reset will remove this ie. * { margin:0; padding:0; } Code (markup): google "css resets" if you want to know more
This is because of margin collaps. http://www.w3.org/TR/CSS21/box.html http://www.howtocreate.co.uk/tutorials/css/margincollapsing
Thanks for the additional input! After another 5 hours of beating my head against the proverbial CSS wall I finally figured out that it was indeed something having to do with margin collapsing. You know it's something but CSS is honestly more difficult to figure out than PHP programming for me. Than MySQL database normalization or just about anything else that I can think of having done on my computer in recent years. With the exception of when I switched from Windows to Linux. Talk about a royal pain (though I wouldn't go back for anything now). What makes CSS so difficult is that you have variables all over the place that apply to what you are doing on the screen but which variables you do not know about. All you see is your layout on the screen not showing the way you want or the way that it would seem it should...I mean by all that is logical or reasonable. Browser incompatibilities, CSS methodologies and methods that are not intuitive or logical as in a human being can figure them out without too much research, different versions of CSS that deal with things very differently, and so forth. I don't know but it sure seems to me that the standard powers that be might have been able to do a better job in coming up with something that was not ...well...so difficult to work with. Oh well...what is, is and there is nothing I can do about it. My hat off to those who make a living doing CSS. I'll go back to my nice PHP Carlos
And i can say just the opposite thing! I eat CSS for breakfast but with much effort i am still a noob in PHP and know next to nothing in databases
Goodness gracious! I read one of the tutorials at one of the links posted above and it's enough to drive someone nutty (http://www.howtocreate.co.uk/tutorials/css/syntax)! I mean the subject of the tutorial not the way the author wrote...he did an excellent job! I understand what it is saying. Perfectly. But goodness gracious! Imagine if I had to write PHP code on the basis that there were ten different ways to write each statement (kind of like there is with Perl and precisely one of the reasons it is not as easy as PHP to learn). Oh and each statement had some default code which was executed that one did not know about and which one had to Google all over the place to try and figure out. Oh and what if PHP did not quite run the same on every platform? I mean where various normal statements did not do the same thing in the code depending on whether the code was run through Apache on Linux or Apache on Windows or ISS on Windows or on the Mac somehow. CSS is about the least cross platform compatible "language" I know. If we look at a platform as being the browser it is running in at any particular point in time. If CSS was a normal programming language that was not needed to do something on the computer...people would be leaving it in droves! Needed in the sense that one presently needs it to do presentation in a better way than is possible with HTML alone. It has the feel of a "language" put together by committee! I'm done ranting now LOL. Thanks for letting me vent. I'll go back to CSS coding now. Carlos
That's interesting. You know I think you have to kinda think in fluid terms a bit to be able to be real good at CSS. Which if true makes logical sense in that one is dealing with presentation. Artistic presentation if you will. You have to have some arteesty something or other bent to your personality. The ability to see things in abstract. To think outside the box (LOL). Me? I am logical and analytical to the max. A + B always equals C. C = A + B. C - A = B and C - B = A and no other. No adding of D sometimes depending on the value of A. No missing of B if one is using Windows vs Linux. Just plain old simple logical math. No artistic fluid this or that in it at all. No shades of color. The sky is blue and the night is black and the grass is green. Logical, rational, clear cut simple. That's what I like about PHP. And the fluid nature of artistic presentation is what I can't stand about CSS. At least in the sense that I can't stand being forced to be artistically fluid when I would rather be logically bounded by distinct and clearly defined rules that don't change based on this or that. I'll take a break once in a while to go and be arteestic in some way. But it's just not in my nature to be artistic when I am trying to get something done on the computer. Carlos
Absolutely, absolutely, i know where you are coming from. Actually i would also prefer some sort of surety in what i code. If i write to 'go fetch me a ball' it should exactly do that, not something else. After all its computer code right, it should behave in a predictable or say same-result-every-time manner. But CSS, hah i know exactly what are the very boring parts of it & what must be a turnoff for ya
PHP is used to output (X)HTML, which is styled using CSS. How did you master PHP before mastering CSS? Personally, I'm still a PHP newbie. CSS, on the other hand, is quite straightforward for me.
Man, you sound like a Java guy. Or C. : ) Ah, Tim Toady. There's more than one way to do it... but like with CSS, there's usually only one or two Good ways to do it. Besides, Perl has just one sort. How many sorts does PHP have? : ) On the other hand, there's a list I have written down on what really is true or false in Perl because there's junk like the string "0" is true... someone actually made a whole node listing it. Unlike, say, Ruby where there's just one plus undefined. If you think about it, we have exactly the same problem with Javascript, which is a normal programming language. The problem isn't Javascript (well, except when it is) nor is it CSS. It's what's running it. So the problem is more like, what if there were different PHP interpreters? And the interpreter depended not on your server, but on users' machines. That's why it's a pain. You have to write different code for different parsers and basically, different compilers or interpreters. (basically what you said) The browsers are usually the ones who barf on the code. They interpret it. They render it. And not only CSS, but they puke on HTML (tag soup rendering and dealing with errors being different) and Javascript (especially our favourite friend in CSS, IE). Programmers do seem to have trouble with CSS, and tend to do better with tables, but like any language, it's all about learning the rules. In CSS' case, that means learning the rules of those who will be parsing and interpreting (the browsers). And then of course the users themselves, but that's not really different. Imagine you suddenly had to do all your PHP stuff in Lisp : ) Heh()((())).
@Stomme: "Imagine you suddenly had to do all your PHP stuff in Lisp : ) Heh()((()))" I imagine that a skilled Lisp or Scheme programmer would think it easy and straight forward by comparison. At least you didn't use Perl in your example; that would just be cruel. @Carlos: The problem you're facing is that while it seems like a programming language, css is not. It is a declarative presentation language. It simply says "this selector has these properties which have those values". The source code says nothing about how those property values are rendered. That stuff is under the hood (or bonnet as the Brit types might say). The specs lay that out for the browser vendors. We read the specs in order to understand what happens to our rulesets when we shove our stylesheet into the black box that is the client browser. In your issue, you have top and bottom margins on the p element. You either set them yourself, or relied on the browser's internal style sheet. Now let's look at the rendering issues. The authors of these specs had to figure just what a web author really needed in typographical terms. If margins didn't collapse, the indicated margin would be summed between two consecutive paragraphs. What if the paragraphs were in another container? The margins need to bleed through, else the same typographic problem. What if the author wants the doubled margins? Provide an out. What about margins on absolute positioned elements? Another issue. How about floats, where their presence affects inline boxes but not block boxes? But then some block containers have their own formatting context; how do you render those margins? And so on, and so on. CSS wouldn't have caught on at all, if each web author had to write a series of case statements to cover the contingencies. It's been done for us, but we have to RTFM, again and again, if we want to grok in fullness. cheers, gary
Sure. But what if you started out with PHP first? You wouldn't know what to do lost in those strange parentheses : ) BTW somewhat unrelated but I read a strange usenetty message explaning why writing in Lisp/Scheme while stoned— er, "checmically modified" is better for you if don't use a mouse... okay well at least I think it's funneh. Er, you meant "bad or horribly obfuscated Perl and version 4", right? : ) We're not talking about drawing a camel with it or anything. (snippet) while(/^[^\(]*\([^\)]*\(/){s/\(([^\(\)]*)\)/\[\1\]/} s/.*?\((.*?)\).*/\1/; tr/\[\]/\(\)/; Code (markup): I just saw that one today. The author knew it was somehow Wrong : ) (of course it is, just looks awesome; yes it's a regex) I still think you'd be an excellent Perl guy, being all crusty and unixy. I think you had bad experience based on bad or old Perl (or something submitted to an Ob-Fu or golfing contest).
Perl is obfuscated by nature. My first experience with Perl was ca. 2000, when I switched to Linux, and began doing html+cgi programming. Perl5 was the then current version. I have never used v4 (actually v2 renamed). Don't blame Perl code's lack of clarity on the last generation. That said, I would never denigrate Perl's powerful text parsing abilities. Of course, I still prefer sed and awk for that purpose. cheers, gary
I'd say the same thing about PHP if all I ever saw was badly-written obfuscated-but-also-somehow-still-pedantic PHP. I blame it on bad authors and newbs like me (lord knows how hard I'll barf when I look back at my current Perl 5 years from now). Your Perl is as clear as you write it. That's what Larry was using, until he needed them on steroids. So he extended them and called it Perl : ) Cmon, it's The tool of Crusty Unix Dudes! See?? unsponsored ad: We're at Perl 5.10 though there's a version of 6 coming out this spring... : ) I feel like a Jehova's Witness. I should be going door to door passing out pamphlets and chanting or something.