/    Sign up×
Community /Pin to ProfileBookmark

DOCTYPE affecting margin spacing

I somehow slipped through the cracks of being taught to add the DOCTYPE tag to all my html documents.

I started to do this (first i tried strict, then transitional) and both are effecting my pages in strange ways.

As far as I can tell, it’s changing the way my top & bottom margins (set in a CSS document) are displayed – both more space and less space, it changes per page…

It is possible that my code is not *perfect* – but I really can’t find any problems. Take the page below for instance – it’s displayed within an iFrame. The top and bottom margins for the line images below (there are four down the page)

[CODE]<p align=”center”><img src=”images/fl_06.gif” width=”285″ height=”12″ boder=”0″ class=”line2″ /></p>[/CODE]

stretch out and cause the content not to fit

is there a danger in leaving the doctype out?

here is the full page:

[CODE]
<!DOCTYPE HTML PUBLIC “-//W3C//DTD HTML 4.01//EN” “http://www.w3.org/TR/html4/strict.dtd”>

<html>
<head>
<title>news</title>
<LINK REL=stylesheet HREF=”main.css” TYPE=”text/css” id=”cssHolder”>
<meta http-equiv=”Content-Type” content=”text/html; charset=iso-8859-1″>

</head>

<body class=”frame”>
<img src=”images/home_black.gif” class=”hright” width=”56″ height=”27″ border=”0″ /> <img src=”images/f_01.gif” class=”hright” width=”38″ height=”27″ border=”0″ />

<p align=”center”><img src=”images/fl_01.gif” width=”285″ height=”13″ boder=”0″ class=”line” /></p>

<img src=”images/b_01.gif” width=”15″ height=”10″ boder=”0″ class=”bullet” /><h1 class=”home”><span class=”hometitle”>What’s New: 10/01/2005</span><br>
<img src=”images/letter_f.gif” width=”18″ height=”18″ border=”0″ class=”letter” /><span class=”hometext”>riends of the Johnson,<br>

Welcome to “The Book of God Johnson,” the new GJ
website brought to you collectively by the power-duo
of Erik Van Hauer and Joe Ringus; now appropriately
dubbed “The GJ Weblords”. *Hey, give us… <a href=”jf/10_01_05.html” target=”right” class=”home”>read more>></a></span>
</h1>
<h1 class=”homedate”>(added – 10/01/05)</h1>

<p align=”center”><img src=”images/fl_06.gif” width=”285″ height=”12″ boder=”0″ class=”line2″ /></p>

<img src=”images/b_06.gif” width=”16″ height=”10″ boder=”0″ class=”bullet” /><h1 class=”home”><span class=”hometitle”>What Are You Gonna Be?</span><br>
<img src=”images/letter_s.gif” width=”18″ height=”18″ border=”0″ class=”letter” /><span class=”hometext”>tart scrounging up your gear
for this year’s Halloween show! Get your reservations early and come on down to Rochester on Oct. 28th to support the GJ Crew.
More info in the <a href=”tourdates_oct2.html” target=”right” class=”home”>Tourdates section.</a></span>
</h1>
<h1 class=”homedate”>(added – 10/01/05)</h1>

<p align=”center”><img src=”images/fl_07.gif” width=”285″ height=”12″ boder=”0″ class=”line2″ /></p>

<img src=”images/b_05.gif” width=”15″ height=”10″ boder=”0″ class=”bullet” /><h1 class=”home”><span class=”hometitle”>Multiples – First GJ Album!</span><br>
<img src=”images/letter_t.gif” width=”18″ height=”18″ border=”0″ class=”letter” /><span class=”hometext”>he new cd by the Johnson is
entitled “Multiples” and is in the making. Soon, the GJ will be recording vocal tracks and the album should be mixed & mastered by mid
October. Stay tuned right here for more news.</span>
</h1>
<h1 class=”homedate”>(added – 10/01/05)</h1>

<p align=”center”><img src=”images/fl_03.gif” width=”285″ height=”12″ boder=”0″ class=”line2″ /></p>

<img src=”images/b_02.gif” width=”15″ height=”10″ boder=”0″ class=”bullet” /><h1 class=”home”><span class=”hometitle”>Unholy Visions</span><br>
<img src=”images/letter_k.gif” width=”18″ height=”18″ border=”0″ class=”letter” /><span class=”hometext”>eep an eye on our
<a href=”gallery.html” target=”right” class=”home”>Gallery</a> section. It’s full of brand new pics, including images of the
guys at the Door County recording session. The Gallery will always
be updated with fresh material – so check in often.</span>
</h1>
<p align=”center” class=”thumb”><img src=”images/gallery/08_03_05/08_03_05_3_th.jpg” width=”45″ height=”45″ border=”0″ class=”thumb”>
<img src=”images/gallery/09_21_05/09_21_05_2_th.jpg” width=”45″ height=”45″ border=”0″ class=”thumb”>
<img src=”images/gallery/09_21_05/09_21_05_3_th.jpg” width=”45″ height=”45″ border=”0″ class=”thumb”>
<img src=”images/gallery/door_county/03_th.jpg” width=”45″ height=”45″ border=”0″ class=”thumb”>
<img src=”images/gallery/door_county/08_th.jpg” width=”45″ height=”45″ border=”0″ class=”thumb”></p>
<h1 class=”homedate”>(added – 10/01/05)</h1>

</body>
</html>[/CODE]

to post a comment
HTML

4 Comments(s)

Copy linkTweet thisAlerts:
@FangOct 05.2005 — No DTD means you are using quirks mode which gives more problems with x-browser compatibility. See http://www.w3.org/International/articles/serving-xhtml/#quirks
Copy linkTweet thisAlerts:
@QuinnEskimoauthorOct 05.2005 — so what you're saying is that I should keep the Doctype and adjust my spacing to look how it originally did?

strict means I can't have any mistakes, right? should I use transitional just incase?
Copy linkTweet thisAlerts:
@the_treeOct 05.2005 — You can't have mistakes with either. Strict means you can't use depreciated elements.
×

Success!

Help @QuinnEskimo 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.25,
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,
)...