DIV Tags in Mozilla

[robot180]

I have been having trouble with DIV tags in Mozilla. I use Mozilla Firefox 0.8 for Windows. I don't have any examples right now, but I test the same page in IE 6.0 and it looks fine.

I have two div tags side-by-side. They each say float: left. The left one is shorter than the right one but I don't want to limit the lengths of either one. The right one says float: left and clear: right. This way, if the contents of it are longer than the left column, it stays seperated into columns. However, what happens is if I put a p tag with a sentence in it, for example, and the text is just slightly longer than the space provided, I expected it to wrap the text, which it does in IE. However, in Mozilla, it moves the entire div tag under the left div tag instead of to the right of it. Then, if it still doesn't fit, it wraps it anyways.

I don't know if I explained this too well, but if anyone gets what I am saying, and if you know how to fix that, please let me know. Thanks.

[Ryan M.]

Originally Posted by robot180

I have been having trouble with DIV tags in Mozilla. I use Mozilla Firefox 0.8 for Windows. I don't have any examples right now, but I test the same page in IE 6.0 and it looks fine.

I have two div tags side-by-side. They each say float: left. The left one is shorter than the right one but I don't want to limit the lengths of either one. The right one says float: left and clear: right. This way, if the contents of it are longer than the left column, it stays seperated into columns. However, what happens is if I put a p tag with a sentence in it, for example, and the text is just slightly longer than the space provided, I expected it to wrap the text, which it does in IE. However, in Mozilla, it moves the entire div tag under the left div tag instead of to the right of it. Then, if it still doesn't fit, it wraps it anyways.

I don't know if I explained this too well, but if anyone gets what I am saying, and if you know how to fix that, please let me know. Thanks.

I have no trouble with DIV tags under Mozilla Firefox. (My website is http://texan.homeunix.net. It's almost entirely DIV tags.) How are you giving it those parameters? CSS? IE is fairly "I'll figure out what they meant" while Mozilla is more "That doesn't work; I'll ignore it." Maybe whatever you're doing it isn't completely correct HTML...

==EDIT==
Could you get the actual code you're using? That would help.

[Max Lobovsky]

I doubt this is the reason, but you might as well upgrade firefox to 0.91. Can't hurt (and it might help). Otherwise, post the code, like Texan said.

[robot180]

I don't have code right now to post, but we just tried putting it in a table and that fixed it. I was trying not to use tables, which brings up another question. Someone told me that tables are no longer supported by web standards. Is this true? I rather use div tags, but tables work the same in most browsers, unlike div tags.

[Max Lobovsky]

Just by looking at arbitrary webpages, you wouldn't know it, but tables are supposed to be in decline. I believe they are deprecated (other methods, like DIV, are preferred over them) in current standards and will be eliminated from standards eventually. If you want some real in depth info, check the official docs: http://www.w3.org/TR/xhtml1/#h-4.1

[Joe Ross]

Tables have never been designed for positioning items on a page, and thus are deprecated for that. Tables are designed for organizing information, and are not deprecated for that use.

Just like you don't type a letter in excel, you shouldn't position things with a table.

[jonathan lall]

There's no such thing as "no longer supported by web standards," but the use of tables in a presentational context is deprecated by the community, and is of course misusing a medium for representing tabular data. Often tables are easier to use, but are of course only useful if you intend for your pages to only ever be readable by specific types of browsers on PCs. They destroy the idea of browsing the web from anything other than a PC, and incidentally are slow to render and even slower to load comparatively. That said, table-based layouts will still validate and render as you'd expect in mainstream browsers under typical doctypes. They'll just be perpetually a tad silly. If you're still interested, I'm fairly certain I could fix your problem without the use of tables if you post the source code.

As for div tags, max, they aren't much better. Overuse of divs and spans (which are theoretically for defining divisions not addressed by othe HTML elements) results in semantic nonsense and presentational HTML. The table will be in HTML for the forseeable future, but is simply meant for tabular data, and not as a structural device.

[Max Lobovsky]

I understand the whole content vs presentation thing, I guess I should have wrote about that in my post.

Jonathan, I'm not sure what you mean by "overuse" of divs and spans. What is overuse? Obviously don't make a page more complicated than you need to display how you want it to, but, if I'm not mistaken, divs and spans are what you are intended to use for positioning in a webpage. Use them (in your CSS, of course) till you get the appearance you like. Correct?

[jonathan lall]

Originally Posted by maxlobovsky

Jonathan, I'm not sure what you mean by "overuse" of divs and spans. What is overuse? Obviously don't make a page more complicated than you need to display how you want it to, but, if I'm not mistaken, divs and spans are what you are intended to use for positioning in a webpage. Use them (in your CSS, of course) till you get the appearance you like. Correct?

Well, what happens in some cases (and I'm a little bit guilty of this on my team's site) is web authors use divs just to change styles in specific areas, for example to change the font of some selection of text, or to position a paragraph just right when they could have styled another element. Semantically, this is incorrect, as simply enclosing some text in a div and id'ing the div doesn't always mean anything, and is often just an easier way of achieving a look. The way I justify doing that is if the task is impossible, or silly to do "properly", I'll just use a div or span. These are minor infractions.

The true overuse of spans and divs occurs when webdesigners try such presentational things as try to nest them within each other to get rounded corners as background-images for example. Sometimes, instead of defining a paragraph as display: block, they'll enclose it in a div which is by default block-level (which means, basically, it's shaped like a block and doesn't flow around other elements like text does). Sometimes they'll use CSS selectors to define rules around any span in an element

p span { font-size:larger; }

instead of simple <big> tags, etc.

[rowe]

Originally Posted by jonathan lall

p span { font-size:larger; }

instead of simple <large> tags, etc.

wait, what ive been reading about html and css, the problem in most pages is the fact that they use tags like <large>, <big>, etc over and over agian instead of just using css. as i understand it, html should just be used for simple content and css should be used for the actual styling of the page.

[Max Lobovsky]

Errr, using <large>, <strong> etc, is fine. In fact, it would be incorrect to use CSS for such a use. You shouldn't create some sorta span to just to bold this word or to italicize this one. The articles you are reading are probably referring to pages where all <p> or all <h1> are additionally <strong> or <large> modified. If you want to bold your headers or your text, do that in CSS.

Another thing you might have read is about <strong> vs <b>. Any html tags that just specify the appearance of something like <b> (bold) or <i> (italicize) should be replaced with tags taht have more semantic meaning like <strong> and <em>. They will appear the same (at least in most mainstream browsers), but will also be usable on all sorts of displays. For example, if it is some sort of html-to-speech browser, you might drop <b> assuming they are just appearance tweaks, but you wouldn't drop <strong> (you might have the broswer read the word with emphasis....errr... that <em> but close enough).

(the <large> tag probably falls under html tags like <b> and <i> that are deprecated because I can't think of any english semantic for it other than "display larger")

[jonathan lall]

Absolutely right, max. Though I should note, I started a trend when I wrote that last sentence. It's a <big> tag, not a <large> tag. AFAIK, <large> doesn't exist.

[Adam Y.]

Code:

p span { font-size:larger; }

instead of simple <big> tags, etc.
__

Actually I just checked and they really want webmasters to get rid of any of the formating tags and use css in place.

The following HTML elements specify font information. Although they are not all deprecated, their use is discouraged in favor of style sheets.

This is what w3c says about all font style tags except for the Em and Strong tags. Those tags fall under a category for technical papers.

[robot180]

I think that it is still up to web designers to decide whether they want to use all CSS or use some html tags. I also agree that in the situation of a technical paper or any kind of article-type writing, strong and em tags should be used. I think that if you are setting any other CSS properties for the text, then use CSS, otherwise, use the html tags, except for technical papers or whatever where you would always use strong and em so that programs like Jaws, which reads the screen out loud, realizes that it is more important. I realized this when making a website for an organization for the blind and visually handicapped. That is how I did it.

[Astronouth7303]

what ever happened to <b> and <i>?