View Single Post
Parody
Senior Member
 
Join Date: Jan 2013
Location: Rochester, MN
Posts: 1,516

Old January 27th, 2017, 01:34 AM
Quote:
Originally Posted by EightBitz View Post
In regards to tables and lists, there could be a few different things going on here. I've noticed that between IE, Chrome and Firefox, there are notable differences between how tables are displayed.
One thing that might help is specifying a DOCTYPE. The sample outputs I've seen don't have one, leaving the browsers to make more guesses about how to display your HTML+CSS. (It's called "rendering in Quirks Mode" if you want more info.)

The DOCTYPE needs to be the first line of your HTML file. The one for HTML 5 is pretty simple:
Code:
<!DOCTYPE html>
Adding that won't make the different browsers (and versions of browsers) create identical output, but they should end up a lot closer than before.

Quote:
Originally Posted by EightBitz View Post
My understanding is that inline formatting overrides external CSS files, so if you preserve formatting, the table formatting in the CSS file should have ... no ... effect? (Famous last words, right?)
The style attribute does override earlier styling, but only for the things specified within. Anything not included in the style attribute will be determined by whatever other rules exist. The rules in your external CSS file will only have no effect if the style attribute overrides everything within those rules.

Quote:
Originally Posted by EightBitz View Post
The lists are what have me most confused, at least in the aspect that lists are much simpler than tables, so their behavior should be more straightforward.
Looking at the part of tmilktoast's sample where there's a list, the surrounding <p> elements' style attributes have a margin-left but the <ul> does not. HTML lists should be treated the same as paragraphs and tables for most styling purposes.

FWIW, I think you'd be better off putting a <div> around the things you want to indent and adding padding or margin to the <div>. (I threw a quick example up at JSBin.)


Last edited by Parody; January 27th, 2017 at 02:07 AM. Reason: Added example.
Parody is online now   #74 Reply With Quote