4 ms·

Wow I just started making websites of my own recently and have encountered so many things that are immensely infuriating about how the language is interpreted t

• usaphp 8y ago
  They seem to be confusing when you are just starting designing, but once you spend more time with it - most of it starts to make sense > The fact that margin-top and margin-bottom percentages are computed based on the width of the parent element, not the height. It's actually much better this way, imaging a block of text with varied content. If you had margins calculated based on a height - you will have a margin that depends on text content size, which is wrong, instead you want your margins to depend on a screen size width, not the content inside > Collapsing margins It's a great solution as well, imagine you have a div that you want to have margins on top and bottom of 20px. It makes perfect sense to collapse margins if you have say 2 of those div's running one after another, because you don't want them to have 40px margin, you only want 20px. So when there is another element that is not that div - you will still have your desired 20px margin.
  • Zarath 8y ago
    > It's actually much better this way, imaging a block of text with varied content. If you had margins calculated based on a height - you will have a margin that depends on text content size, which is wrong, instead you want your margins to depend on a screen size width, not the content inside So using width to compute a vertical margin is somehow a better solution? If I wanted a margin of a fixed size that doesn't dynamically change based on content, I would define it exactly using vh, or px. > It's a great solution as well, imagine you have a div that you want to have margins on top and bottom of 20px. It makes perfect sense to collapse margins if you have say 2 of those div's running one after another, because you don't want them to have 40px margin, you only want 20px. So when there is another element that is not that div - you will still have your desired 20px margin. I just want the code to behave as I instructed it. If I say this div should have 20px of margin on top and bottom, then it should. Don't go behind my back and say "we know better" and delete it. There seem to be plenty of ways to achieve only 20px on successive divs without resorting to what is basically undocumented behavior that explicitly contradicts what is programmed in the file. For example, I could just give all divs 20px of margin-top, and then style :last-child with 20px margin-bottom. This is almost certainly a better solution than resorting to collapsing, at least in my opinion.
    • windwake12 8y ago
      CSS and HTML will usually afford a specific approach. Being a web developer is knowing what these approaches are, and to know when stuff might get "not nice". So when you see a graphic designer using multiline text blocks with elided text in their design layouts, you know to raise a red flag and get that removed. Personally, I've not found collapsing margins a huge issue either way. It's just the way it is. There's 10 billion ways to add distance between two elements in the browser, so pick a solution and go with it.
    • usaphp 8y ago
      > I just want the code to behave as I instructed it. If I say this div should have 20px of margin on top and bottom, then it should That’s exactly what collapsing margins are doing. It makes your div have 20px margin, not 40px. Imagine two blocks one above another. If margins were not collapsing - your divs would have 40px margin instead of 20 like you set. > If I wanted a margin of a fixed size that doesn't dynamically change based on content It does change based on browser width, that’s what most would want. From a designer perspective - the wider the element is - the more margin on top and bottom it should have for better readability. You don’t want your margins to be different for a list of various text items for example, it will look ugly. You want margins to be different based on a screen size.
• scns 8y ago
  I often feel annoyed too but CSS what we have been given to work with. Instead of wasting time being annoyed that reality does not match our expectations it is better for our health to swallow the bitter (red?) pill, accept reality and learn CSSs idiosynchracies. The page http://book.mixu.net/css/ http://book.mixu.net/css/ shoud help.
  • afarrell 8y ago
    While reading that page, it is helpful to make flashcards like you are a med student. In fact "flashcards are a good idea" is probably a good piece of advice for gaining a mental model of a system which was the result of more incremental evolution than all-at-once intelligent design.
  • adamrezich 8y ago
    >You may have used z-index to "fix" the relative stacking order of content. But did you know that z-index is not absolute across the document, but rather relative to a stacking context? wait what the FUCK