/    Sign up×
Community /Pin to ProfileBookmark

DIV tags being a pain to position

Copy linkTweet thisAlerts:
Nov 10.2006

I have a current work in progress page that is built with tables, but I want to change to div tags if possible so I don’t have the empty padding between blocks of content.

Here is a link to the current site and you can see where I am trying to get images in there, but the tables are seperating them along their borders. ?

[URL=http://69.180.251.135/copy%20of%20index.html]website[/URL]

If I can fix this with tables that is great, but I think I will need DIV boxes and they are really being a pain ?

so which is best DIV or TD?

Also is there a place with all the tags and their attributes with explanations? It would be helpful for a newb like me to have a roadmap ? I am sure there are tons of tools that I am not using because I simply don’t know they exist.

S!

Theremin

to post a comment
HTML

2 Comments(s) ↴

Copy linkTweet thisAlerts:
@KravvitzNov 10.2006 — This is kind of long, but you did ask several questions.

1) To get started I recommend you read these:

[url=http://www.w3.org/MarkUp/Guide/]Getting started with HTML[/url]

[url=http://www.w3.org/MarkUp/Guide/Advanced]More Advanced Features[/url]

http://www.htmldog.com/guides/

This is a valuable resource once you know some of the basics:

[url=http://www.w3.org/TR/html401/]HTML 4.01 Specification[/url]

2) [url=http://www.dynamicsitesolutions.com/html/tables-for-tabular-data-only/]Why should you avoid using tables for layout?[/url]

3) You should use a complete doctype (one that includes a URL) to get browsers to render as close to the same as possible. I recommend HTML 4.01 Strict. A doctype is not a magic fix. It is the first step in the process of fixing your page. The doctype tells the browser how to render the page. That HTML 4.01 Transitional doctype which does not include the URL tells the browser to render in Quirks Mode -- a generally bad thing.

[url=http://hsivonen.iki.fi/doctype/]Activating the Right Layout Mode Using the Doctype Declaration[/url]

[url=http://www.alistapart.com/articles/doctype/]Fix Your Site With the Right DOCTYPE![/url]

[url=http://www.juicystudio.com/choosing-doctype/]Choosing a DOCTYPE[/url]

[url=http://www.webdevout.net/doctype_switching.php]Doctype switching[/url]

[url=http://www.communitymx.com/content/article.cfm?cid=85FEE]Rendering Mode and Doctype Switching[/url]

http://www.w3.org/QA/2002/04/Web-Quality

http://www.w3.org/QA/2002/04/valid-dtd-list.html

4) [url=http://www.456bereastreet.com/archive/200609/no_more_transitional_doctypes_please/]No more Transitional DOCTYPEs, please[/url]

[url=http://accessites.org/gbcms_xml/news_page.php?id=23]It's Time To Kill Off Transitional DOCTYPES[/url]

[url=http://24ways.org/advent/transitional-vs-strict-markup]Transitional vs. Strict Markup[/url]

5) Don't make a common newbie mistake -- the point of table-less layouts is [b]not[/b] to simply replace tables with <div> elements. The point is to use [url=http://www.dynamicsitesolutions.com/html/semantics/]semantically correct markup[/url] and then use CSS to make it look the way you want it to.

6) Always be sure that your (X)HTML and CSS are valid.

http://validator.w3.org/

http://jigsaw.w3.org/css-validator/

7) This is a bit old, but much of what it says is relevant -- [url=http://www.mcsr.olemiss.edu/~mudws/font.html]What's wrong with the FONT element?[/url]

What should you use instead of the FONT element? [url=http://style.cleverchimp.com/font_size/livetext.html]Beyond the FONT tag: Practical HTML text styling[/url]
Copy linkTweet thisAlerts:
@ThereminauthorNov 12.2006 — thanks for the reply ?

I am going to devote the better part of tomorrow to this and maybe some of tonight ?

I didn't know I was doing something wrong using the transitional declaration. I didnt really even have any idea what that meant ?

I do understand that I want most of my formatting to be done in .css though. that way I edit it there once and if I have more than one page I make changes to all of them. That just makes good admin sense.

I know the basic style I want to go for and was doing it in .css using div tags, but I kept getting the boxes on the screen in places I wasnt intending and was generally having a very difficult time. Especially with the newsheader and the news content portions. They didnt want to center properly and if they did I would end up with a horizontal scroll bar even though there was no content to the right of what was visible.(at least it didnt look like there was)

Well I will chew on this a bit and see what problems I can work through and come back when I have hit another brick wall ?

appreciate the help

S!

Theremin
×

Success!

Help @Theremin spread the word by sharing this article on Twitter...

Tweet This
Sign in
Forgot password?
Sign in with TwitchSign in with GithubCreate Account
about: ({
version: 0.1.9 — BETA 5.18,
whats_new: community page,
up_next: more Davinci•003 tasks,
coming_soon: events calendar,
social: @webDeveloperHQ
});

legal: ({
terms: of use,
privacy: policy
});
changelog: (
version: 0.1.9,
notes: added community page

version: 0.1.8,
notes: added Davinci•003

version: 0.1.7,
notes: upvote answers to bounties

version: 0.1.6,
notes: article editor refresh
)...
recent_tips: (
tipper: @AriseFacilitySolutions09,
tipped: article
amount: 1000 SATS,

tipper: @Yussuf4331,
tipped: article
amount: 1000 SATS,

tipper: @darkwebsites540,
tipped: article
amount: 10 SATS,
)...