I hate HTML
-
So, I have a heading div, and below it a text div. Between the two a mysterious white gap, that can't be traced to any attribute anywhere. In my innocent ignorance, I set specific widths for the two so their right edges align with the right edge of the page heading, and all is good, except the text in the text div is rudely touching the sides of the div, looking very untidy. So, I set a padding of 20px on the text div, and suddenly the mysterious white gap is gone, yay, but the freaking text div is 40px wider. I really misunderstand padding to mean that an elements content is pushed inward from its border. That is how I've read all the diagrams explaining this, so why the hell must setting padding make an element bigger? :mad:
Put the divs in two rows in a table which has a cellspacing and cellpading of 0 (you can specify this in the
<table>tag) - that's what I do when positioning two divs, even if their position is set to static, as it tends to be more reliable :) Regards, --PerspxDon't trust a computer you can't throw out a window
-- Steve Wozniak
-
So, I have a heading div, and below it a text div. Between the two a mysterious white gap, that can't be traced to any attribute anywhere. In my innocent ignorance, I set specific widths for the two so their right edges align with the right edge of the page heading, and all is good, except the text in the text div is rudely touching the sides of the div, looking very untidy. So, I set a padding of 20px on the text div, and suddenly the mysterious white gap is gone, yay, but the freaking text div is 40px wider. I really misunderstand padding to mean that an elements content is pushed inward from its border. That is how I've read all the diagrams explaining this, so why the hell must setting padding make an element bigger? :mad:
I think you mean that you hate CSS. Who doesn't ? What a nightmare that stuff is.
Christian Graus No longer a Microsoft MVP, but still happy to answer your questions.
-
I think you mean that you hate CSS. Who doesn't ? What a nightmare that stuff is.
Christian Graus No longer a Microsoft MVP, but still happy to answer your questions.
Christian Graus wrote:
I think you mean that you hate CSS
I hate it all. I'm using straight tables for a lot of stuff, and even there is anyone's guess half the time. But, I have, at 23h20, completed the second revision of my draft site and will sleep happy.
-
Christian Graus wrote:
I think you mean that you hate CSS
I hate it all. I'm using straight tables for a lot of stuff, and even there is anyone's guess half the time. But, I have, at 23h20, completed the second revision of my draft site and will sleep happy.
You need beer. Lots and lots of it.
Deja View - the feeling that you've seen this post before.
-
You need beer. Lots and lots of it.
Deja View - the feeling that you've seen this post before.
Pete O'Hanlon wrote:
need beer. Lots and lots of it.
That'll be later this evening :)
"The clue train passed his station without stopping." - John Simmons / outlaw programmer "Real programmers just throw a bunch of 1s and 0s at the computer to see what sticks" - Pete O'Hanlon "Not only do you continue to babble nonsense, you can't even correctly remember the nonsense you babbled just minutes ago." - Rob Graham
-
So, I have a heading div, and below it a text div. Between the two a mysterious white gap, that can't be traced to any attribute anywhere. In my innocent ignorance, I set specific widths for the two so their right edges align with the right edge of the page heading, and all is good, except the text in the text div is rudely touching the sides of the div, looking very untidy. So, I set a padding of 20px on the text div, and suddenly the mysterious white gap is gone, yay, but the freaking text div is 40px wider. I really misunderstand padding to mean that an elements content is pushed inward from its border. That is how I've read all the diagrams explaining this, so why the hell must setting padding make an element bigger? :mad:
here's 3 lines that'll solve your initial problems: * { padding: 0px; margin: 0px; } any rules that come after this will override it, so put it at the top... you probably know by now, but padding is actually a shortcut for padding: ; so if you just put one number, it copies it to the rest of them.. i'm not sure what happens when you put 2 or 3 numbers. That's why 20px turned into 40px; DOWNLoAD and USE Firebug!!!!! It couldn't be simpler. and w3schools.com
-
So, I have a heading div, and below it a text div. Between the two a mysterious white gap, that can't be traced to any attribute anywhere. In my innocent ignorance, I set specific widths for the two so their right edges align with the right edge of the page heading, and all is good, except the text in the text div is rudely touching the sides of the div, looking very untidy. So, I set a padding of 20px on the text div, and suddenly the mysterious white gap is gone, yay, but the freaking text div is 40px wider. I really misunderstand padding to mean that an elements content is pushed inward from its border. That is how I've read all the diagrams explaining this, so why the hell must setting padding make an element bigger? :mad:
Last time I made a website I just used flash. Then all I needed was a handy peice of HTML to put the flash in the middle of the screen. It was one awsome peice of flash too. I still can not beleive I lost it :sigh: :((
My current favourite word is: Nipple!
-SK Genius
-
So, I have a heading div, and below it a text div. Between the two a mysterious white gap, that can't be traced to any attribute anywhere. In my innocent ignorance, I set specific widths for the two so their right edges align with the right edge of the page heading, and all is good, except the text in the text div is rudely touching the sides of the div, looking very untidy. So, I set a padding of 20px on the text div, and suddenly the mysterious white gap is gone, yay, but the freaking text div is 40px wider. I really misunderstand padding to mean that an elements content is pushed inward from its border. That is how I've read all the diagrams explaining this, so why the hell must setting padding make an element bigger? :mad:
That's why I drink to excess, so all the pages I design are blurry to the point that everything looks good.. I call it iGoggles. Just put a disclaimer on your page, "best viewed while intoxicated or blind". :-)
- S 50 cups of coffee and you know it's on! A post a day, keeps the white coats away!
-
So, I have a heading div, and below it a text div. Between the two a mysterious white gap, that can't be traced to any attribute anywhere. In my innocent ignorance, I set specific widths for the two so their right edges align with the right edge of the page heading, and all is good, except the text in the text div is rudely touching the sides of the div, looking very untidy. So, I set a padding of 20px on the text div, and suddenly the mysterious white gap is gone, yay, but the freaking text div is 40px wider. I really misunderstand padding to mean that an elements content is pushed inward from its border. That is how I've read all the diagrams explaining this, so why the hell must setting padding make an element bigger? :mad:
Get Firefox and Firebug and open your site in Firefox, then hit F12 and go to the layout on the right of firefox. It will show you what your layout is made up of. When I was learning CSS I messed about with simple pages for a while to see the effect of different CSS on layout. A quick search for something like "CSS layout" should give you about 50 million web pages to read with your beer.
-
Phew! You just gave me a heart attack. My client uses IE, and I hadn't even checked this on IE yet. :~ Luckily it all seems OK - it's very simple with bog standard ASP.NET server controls. :-D
Brady Kelly wrote:
My client uses IE, and I hadn't even checked this on IE yet
That will be playing with fire. Just as these developpers developping with admin rights and realizing two days before release that the clients do not have admin rights on their machine...
-
Brady Kelly wrote:
My client uses IE, and I hadn't even checked this on IE yet
That will be playing with fire. Just as these developpers developping with admin rights and realizing two days before release that the clients do not have admin rights on their machine...
Fortunately, just this once, I can tell them to use Firefox, then they'll be happy long enough for me to fix it for IE. ;P
-
I think you mean that you hate CSS. Who doesn't ? What a nightmare that stuff is.
Christian Graus No longer a Microsoft MVP, but still happy to answer your questions.
Christian Graus wrote:
I think you mean that you hate CSS. Who doesn't ? What a nightmare that stuff is.
I have to agree.. I've spent many a wasted hour using CSS trying to get the correct line-up on an HTML element... :sigh:
Billy. MCPD Windows Developer "Duct tape is like the force, it has a light side, a dark side and it holds the universe together!" - Anonymous my holding page..more coming soon!
-
So, I have a heading div, and below it a text div. Between the two a mysterious white gap, that can't be traced to any attribute anywhere. In my innocent ignorance, I set specific widths for the two so their right edges align with the right edge of the page heading, and all is good, except the text in the text div is rudely touching the sides of the div, looking very untidy. So, I set a padding of 20px on the text div, and suddenly the mysterious white gap is gone, yay, but the freaking text div is 40px wider. I really misunderstand padding to mean that an elements content is pushed inward from its border. That is how I've read all the diagrams explaining this, so why the hell must setting padding make an element bigger? :mad:
-
Brady Kelly wrote:
why the hell must setting padding make an element bigger? Mad
I'd say it's because of this: Internet Explorer box model bug [Wikipedia][^]. But you say you haven't tried it on IE? That's weird...
It's very likely because I somewhere read about the IE box model, and remembered that as correct.
-
here's 3 lines that'll solve your initial problems: * { padding: 0px; margin: 0px; } any rules that come after this will override it, so put it at the top... you probably know by now, but padding is actually a shortcut for padding: ; so if you just put one number, it copies it to the rest of them.. i'm not sure what happens when you put 2 or 3 numbers. That's why 20px turned into 40px; DOWNLoAD and USE Firebug!!!!! It couldn't be simpler. and w3schools.com
-
So, I have a heading div, and below it a text div. Between the two a mysterious white gap, that can't be traced to any attribute anywhere. In my innocent ignorance, I set specific widths for the two so their right edges align with the right edge of the page heading, and all is good, except the text in the text div is rudely touching the sides of the div, looking very untidy. So, I set a padding of 20px on the text div, and suddenly the mysterious white gap is gone, yay, but the freaking text div is 40px wider. I really misunderstand padding to mean that an elements content is pushed inward from its border. That is how I've read all the diagrams explaining this, so why the hell must setting padding make an element bigger? :mad:
I wonder if the people who wrote the spec for css, really knew how complicated it all sounds, i find it easier to program in c than to script in html, with css, with javascript, for separate browsers, So now if I "FEEL" like making web pages......I keep it simple I only check for IE and Firefox, with nothing to fancy in the web page. If you need to ask I use an editor for html, css and javascript. Then throw in a HUGE company that likes to break the box with there browser, and wham mo!, please download the latest web browser to remove this annoying message, Did that and the site still complains, I really should get a new email address but hey, HOTMAIL's free. Ive just taken my bed before pill's, If it make sense ..... I must be asleep!
-
So, I have a heading div, and below it a text div. Between the two a mysterious white gap, that can't be traced to any attribute anywhere. In my innocent ignorance, I set specific widths for the two so their right edges align with the right edge of the page heading, and all is good, except the text in the text div is rudely touching the sides of the div, looking very untidy. So, I set a padding of 20px on the text div, and suddenly the mysterious white gap is gone, yay, but the freaking text div is 40px wider. I really misunderstand padding to mean that an elements content is pushed inward from its border. That is how I've read all the diagrams explaining this, so why the hell must setting padding make an element bigger? :mad:
-
Try using something like Blueprint CSS[^], it's a CSS framework and I've found it makes life a hell of a lot easier, especially using the grid test as you can quite clearly see how everything lines up. Paul.
Thanks, I'll check it out on the weekend.
-
So, I have a heading div, and below it a text div. Between the two a mysterious white gap, that can't be traced to any attribute anywhere. In my innocent ignorance, I set specific widths for the two so their right edges align with the right edge of the page heading, and all is good, except the text in the text div is rudely touching the sides of the div, looking very untidy. So, I set a padding of 20px on the text div, and suddenly the mysterious white gap is gone, yay, but the freaking text div is 40px wider. I really misunderstand padding to mean that an elements content is pushed inward from its border. That is how I've read all the diagrams explaining this, so why the hell must setting padding make an element bigger? :mad:
There's got to be a better way. Most of us have spent hours trying to get HTML elements to position correctly. One of the things I hate about HTML is that it's non-hierarchical: It forces you to do everything in one long HTML "function", like a beginning programmer. For a long web page, it's a mess, and it makes finding the elements that generate particular output difficult. I'd like to propose HHTML: Hierarchical HTML. This is HTML with macros/functions that act like markup subroutines. The advantages: 1. A outline of the WHOLE PAGE could fit on one screen, e.g. a table with each element an HTML "function". 2. An HTML "function" can be called from multiple places, eliminating the need for duplicating the same HTML over and over and over. 3. HTML "functions" will facilitate reuse, in effect giving you bigger building blocks to construct your web page. 4. Parameters on HTML "functions" would give even more flexibility, and more reusability. HHTML could be implemented as a preprocessor that expands it to plain vanilla HTML, sort of like how a compiler translates source code to object code. You heard it here first! Alan
-
There's got to be a better way. Most of us have spent hours trying to get HTML elements to position correctly. One of the things I hate about HTML is that it's non-hierarchical: It forces you to do everything in one long HTML "function", like a beginning programmer. For a long web page, it's a mess, and it makes finding the elements that generate particular output difficult. I'd like to propose HHTML: Hierarchical HTML. This is HTML with macros/functions that act like markup subroutines. The advantages: 1. A outline of the WHOLE PAGE could fit on one screen, e.g. a table with each element an HTML "function". 2. An HTML "function" can be called from multiple places, eliminating the need for duplicating the same HTML over and over and over. 3. HTML "functions" will facilitate reuse, in effect giving you bigger building blocks to construct your web page. 4. Parameters on HTML "functions" would give even more flexibility, and more reusability. HHTML could be implemented as a preprocessor that expands it to plain vanilla HTML, sort of like how a compiler translates source code to object code. You heard it here first! Alan
Alan Balkany wrote:
HHTML could be implemented as a preprocessor that expands it to plain vanilla HTML
Isn't that what ColdFusion, PHP, ASP.NET etc. do, or do you mean 100% client side?
