...

View Full Version : Div tags



Xishem
09-19-2007, 01:21 AM
Website: http://gmu.awardspace.com/

On that site, I have the div tag 'navbar'. What I want it to do is make the page look something like this.

http://i13.photobucket.com/albums/a280/relyt_123/GMULayout.png

But, as you can see, it doesn't seem to do anything. Any help at all would be appreciated. Thankyou.

dudeson
09-19-2007, 01:39 AM
try this


<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<HTML>
<HEAD>
<TITLE> New Document </TITLE>
<style type="text/css">
body { text-align:center; }

#top { width:800px; height:100px; background:#ccc; border:1px solid #000; margin:0 auto;}

#bottom { height:30px; width:700px; border:1px solid #000; border-width:0 1px 1px; background:#ccc; margin:0 auto; }

</style>
</HEAD>
<BODY>
<div id="top"></div>
<div id="bottom"></div>
</BODY>
</HTML>

Xishem
09-19-2007, 01:50 AM
The problem with that is that if you have those inside of another div tag, it messes up the formatting.

dudeson
09-19-2007, 01:59 AM
as long as the div u put them in is larger then they are u shouldnt have a problem...

Xishem
09-19-2007, 02:28 AM
Ah. It turns out my original code works fine. It was just a stupid mistake by me. Thanks.

VIPStephan
09-19-2007, 02:47 AM
try this


<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<HTML>
<HEAD>
<TITLE> New Document </TITLE>
<style type="text/css">
body { text-align:center; }

#top { width:800px; height:100px; background:#ccc; border:1px solid #000; margin:0 auto;}

#bottom { height:30px; width:700px; border:1px solid #000; border-width:0 1px 1px; background:#ccc; margin:0 auto; }

</style>
</HEAD>
<BODY>
<div id="top"></div>
<div id="bottom"></div>
</BODY>
</HTML>

This, my friend, might be valid code but itís poorly written. The doctype is incomplete and will cause IE to switch to quirks mode which might have some serious rendering issues as result (different visual output). A correct doctype includes the source URL:


<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">


(And note that (X)HTML strict should be the only doctype you ever use. Transitional is for whiners and those that are too lazy to write proper code (and actually to transition from old, non-standard code to new standards compliant code, not to code new sites with it).)

Secondly itís always good practice to write everything lower case. Not regular text of course but the HTML and CSS. Avid upper case for future compatibility (potential switch from HTML to XHTML where everything must be lower case anyway) and donít mix it at all!

Xishem
09-19-2007, 11:14 PM
Rather than making a new topic, I figured I just post here, again.

I have this code: http://rafb.net/p/H6E5I255.html

I want the bottom bordered div to touch the picture div. Any idea why it's not?

_Aerospace_Eng_
09-19-2007, 11:17 PM
#logo img {
border-bottom:1px solid #000;
border-right:1px solid #000;
display:block;
}



EZ Archive Ads Plugin for vBulletin Copyright 2006 Computer Help Forum