HTML - Just Starting Today... Already Problems.

Hello everyone,

I'm a Computer Science student mainly trained in mathematics and programming languages like C/C++ and Java; I wanted to branch out more into web design and decided to start with learning HTML.

So far, I've signed up for free hosting with Xtreemhost to give myself a sandbox to play with and familiarized myself with Classic FTP. I'm teaching myself using Sam's Teach Yourself HTML and CSS Eighth Edition.

My main frustration comes from my understanding that HTML 5 is the newest standard, but the book I use is using XHTML 1.1 as the standard for teaching. Will this really make much of a difference? Is there anywhere/anything I'm better off learning HTML from if I'm just going to be learning a bunch of deprecated stuff from XHTML 1.1?

It is also my understanding (correct me if I'm wrong) that even though the standard has been issued for HTML 5, browsers are generally slow to add in support for it. So does it really matter at this point in time what standard I am using (HTML 4, XHTML 1.1, HTML 5, whatever) to learn? Would it be correct to say that I can use XHTML 1.1 if I really want to, but if I want to take advantage of all the pretty features of HTML 5, I need to abandon some of my apparently deprecated XHTML 1.1 ways first? On the other hand, if not all browsers are at this point in time supporting the HTML 5 features, why create a website that uses it if it's not going to work consistently across all browsers? As you can see, I'm a little confused =/

I'd appreciate if someone could shed some light on this for me and give me some guidance on... well... where to start learning, really; my Googling gives me conflicting information. My plan was to learn HTML, CSS, and Javascript, then learn how TCP/IP works, pick up some proficiency in Photoshop and Dreamweaver/Frontpage, then branch out into server-side technologies like PHP, ASP, etc... I already have some knowledge of SQL from my database design and programming class.

I did try learning from w3schools.com, but I have a sneaking suspicion that the material isn't quite comprehensive, which bugs me.

Hey, so I want to learn html and I was just wondering what books you guys would suggest starting out with?

So I designed some websites in Photoshop and I'm still learning it, but recently I saw many people talking about Fireworks and how it is a way better way of producing web design work than Photoshop.
They say FW is a more efficient tool, as it was strictly built to create web design. That in terms of web design, it can do everything Photoshop can, but in a more simple way.
Is it true?
If it is, I think learning Fireworks is a good idea.
But..there are soooo many Photoshop tutorials and so much less Fireworks tutorials. And that's my second question: Can I apply Photoshop web design tutorials to Fireworks? I mean, can I watch/ read Photoshop tutorials and figure out how to do the exact same things in Fireworks?

I'd like my MP3 file to play continuously, without starting over each time a new page is opened. Is there code for telling the mp3 to not start over when opening a new page?

Here's the code I use now:
<EMBED SRC="Jaded.mp3" AUTOSTART="true" HIDDEN="false" LOOP="true">

Thank you for your assistance!

Heyy im new to all this but i was woundering if someone could tell me the HTML codes for a sucsessfull FORUM Because i have being usein these free ones but i think now its time to get my own real one please help me out

Thanks
Haydn

this is my page http://web.vtc.edu/users/cjb06271/CI...nal/order.html

there are several things I would like to happen.
1. the right collumn background to be where the right collumn should be(so other links in navbar)
2.The test between the roach pictures to be alligned with the top rather than bottom of pictures (so smaller windows can see)
3. When you size the window smaller than the text, a scroll bar appears, and when you scroll the background no longer exists. If I put it on auto the background will only go as far as the text does.
4. (nice but not required)The cocroachs to be alligned to the left and right of the top bar respectively, and the text in the middle.
5. (nice but not required) the right column background image is being cut in half (as does the top one if you size small enough). any way to make the images ignore the collumns?
don't worry about the colors I will be changing them soon

My OS is windows 7 64bit and have installed:
- internet explorer 9
- Mozilla Firefox
- Google Chrome

My website is getting displayed correctly on Firefox and Chrome but is a bit of a mess on IE9

If you could have a look and let me know if there is anything I could do, would be much appreciated.

Here is one page of my site that is bothering me:

http://www.dashony.com/Solar%20panel...0projects.html

Please check out the white menu, ( SpryMenuBarVertical ) using IE and one of the other 2.
Thanks!

Hi everyone,

I recently landed myself a job as a web manager.
It's been a long time since I done it however, as I've had children to bring up and so on - i'm a bit rusty but getting through it okay.

I've hit a snag however and I'm wondering if anyone can help me...

The website i'm charged with watching over works completely fine bar one problem, and its not even a big problem - just a bit annoying.

One of the images, when opened in Chrome, floats to the left when it is supposed to be central.
This is the only image to do this on the website in any browser.

Has anyone got any tips for me?

I am very new to html editing but trying to work my way around. I have made my website in Dreamweaver and everything looks correct on dreamweaver and on firefox but when opened in IE, everything on my page becomes centered an underlined. The first item on the page is centered and underlined but the coding ends there. Not sure what I did wrong. Thank you in adavance for any help.

Hi

The bit of coding below works fine in firefox and ie 5 and older it does not show right in ie 6 and 7

Please can someone tell me how to fix this bug.


<td align="left" valign="top" bgcolor="#E7EEF5"><ul type="square" class="style2">
<li class="style3">Ground Training, starting and schooling young horses</li>
<li class="style3">Re-schooling and corrective training to overcome behavioural and physical problems</li>
<li class="style3">Rehabilitation following injury or illness</li>
<li class="style3">Training for horse and rider at all levels and disciplines</li>
<li class="style3">Re building confidence between horse and rider</li>
<li class="style3">Re-training race horses</li>
</ul>
</td>
<td align="left" valign="top" bgcolor="#E7EEF5"><ul type="square" class="style2">
<li class="style3">Competition preparation</li>
<li class="style3">Advanced Equine Dental Technician</li>
<li class="style3">Tellington Touch (TTeam) Groundwork and bodywork</li>
<li class="style3">McTimoney Manipulation</li>
<li class="style3">Equine Sports Therapy</li>
<li class="style3">Massage, Stretching and Bodywork classes for horse owners</li>
</ul>
</td>

Hi, I am facing some problem. I am currently doing a html template. But I don't seem to be able to solve the gap problem I am facing (View my snapshot), can anyone help me? Thanks alot!

Snapshot file: http://i49.tinypic.com/3t3eo.jpg

HTML Code:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">

<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<link href="styles.css" rel="stylesheet" type="text/css">
<title>Darren Ng - Future Pilot</title>
</head>

<body>
		<div id="wrapper">
			<div id="header">
				<div id="logo">
					<h1><a href="index.html"><span>Darren's</span> Website</a></h1>
								<table><tr>              	<ul id="menu">
					<li><a class="current" href="#">Home</a></li>
					<li><a href="#">Practice</a></li>
					<li><a href="#">Attorneys</a></li>
					<li><a href="#">Accidents</a></li>
					<li><a href="#">News</a></li>
					<li><a href="#">About Us</a></li>
</tr></table></div>
									
				<div class="clr"></div>
			</div>
			
<table width="100%" height="100%"  border="0" cellpadding="0" cellspacing="0">
    <td align="center" valign="middle"><table width="1000" height="550"  border="0" align="center" cellpadding="0" cellspacing="0" bgcolor="#FFFFFF">
            <tr>
        <td width="1000" height="360" align="center"><img src="images/header.gif" width="1000" height="360" hspace="0" vspace="0" border="0" align="top" usemap="#MapMap"></td>
      </tr>

CSS File:
Code:

body {
				font: .74em Tahoma, Verdana, Sans-Serif, Arial;
				color: #7f7f7f;
				background-image: url('images/bodypixel.gif');
				background-repeat: repeat;
}
h1 { font: normal 5em "Trebuchet MS", Helvetica, Arial; }
p { margin: 0 0 15px; line-height: 1.6em; }
a { outline: 0; color: #304D6F; text-decoration: none; }
li { list-style: none; }
li a, img { display: block; }
img { outline: 0; border: 0; }
#wrapper { width: 984px; margin: auto; }
.clr { clear: both; }
#logo { float: left; padding: 30px 15px; }
	#logo h1 a { color: #fff; }
		#logo h1 a span { color: #808080; }
#menu { height: 44px; padding: 5px 0 0 4px; }
	#menu li { float: left; font-size: 1.3em; text-transform: uppercase; }
		#menu li a { color: #888; margin: 0 50px 0 0; }
			#menu li a:hover { color: #fff; }		
			#menu li a.current { color: #fff; }

Can anyone suggest how i fix the problem i have here with IE?

HTML Code:

<body>

<div id="container">
<div id="header">
	<img src="images/thePlacePromotion.jpg" alt="The Place Promotion Agency for Gloucestershire" width="960" height="80" />
</div>

<div id="middle">
<a href="http://www.glosfirst.co.uk"><img src="images/Middle.jpg" alt="We're building a new website, meanwhile here's a link to the current Gloucestershire First website." width="960" height="578" border="0" /></a>
</div>

<div id="bottom">
<a href="http://www.glosfirst.co.uk"><img src="images/slogan.jpg" alt="We're building a new website, meanwhile here's a link to the current Gloucestershire First website." width="960" height="80" border="0" /></a>
</div>



</div>

</body>

CSS is:

Code:

body {
	background-color: #96be3f;
}


#container {
	width: 970px;
	background-color: #96be3f;
	height:auto;
	margin: auto;
}


#header {
	width: 960px;
	padding: 20px auto;
	margin: auto;
}


#middle {
	width: 960px;
	height: 567px;
	margin: auto;
} 


#bottom {
	width: 960px;
	height: 80px;
	margin: auto;
}

the top header on IE is over to the right! Thanks

Hurley

Let me state my problem. Under my links which is under the banner, it says My Tickets, and User it seems in Internet Explorer it shows an extra 2px border on the bottom. Something to do with the height I assume.

Now in firefox there is a 10px gap in between the Ticket Deck banner and the Links Bar.

Also I can't keep to get the copyright centered for some reason :s .

Here is the html:
Code:

<!DOCTYPE html PUBLIC '-//W3C//DTD XHTML 1.0 Strict//EN' 
	 'http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd'>
 <html><head><title>Ticket Deck v. 1.0 beta</title>
 <link href='index.css' rel='stylesheet' type='text/css' />
<body>
<div id='header'>
    <div id='tlogo'><div id='logo'></div></div>
	    <div id='links'>
		   <ul>
			   <li><a href='#'><img src='images/linksmy.gif' width='91' height='25' alt='My Tickets'></a></li>
			   <li><a href='#'><img src='images/linksuser.gif' width='83' height='25' alt='User Area'></a></li>
		   </ul>
	</div>
</div>
<br />
<div id='memberbar'>
    <div id='textmargin1'>
    test
    </div>
</div>
<br/>
<div id='container'>
    <div id="content">Welcome to Ticket Deck's Ticket System. What is listed below is your ticket's summary clicking on the subject title will
	bring you directly to your ticket.<br/>
        <div id="tickets"><div id="tbar"><div id="textmargin">Ticket Summary</div></div>
		<div id="tcontain">
			<table width='100%' cellpadding='3' cellspacing='1' id='toutline'>
			<tr>
				<th width='5%'>id</th>
				<th width='30%'>Subject</th>
				<th width='10%'>Priority</th>
				<th width='23%'>Starter</th>
				<th width='15%'>Status</th>
				<th width='10%'>Dept #</th>
			</tr>
			<tr>
			</table>

</div>
<br/>
		<center>Welcome Guest! Please login to view your tickets!</center>
		</div>
	</div>

    <div id="nav"><div id="navbar"><div id="textmargin">Login</div></div>
    <div id="textmargin">
    Username: <br/>
	<input type="text" name="username" size="25" /><br />
    Password: <br/>
	<input type="text" name="username" size="25" /><br /><br />
    <input type="hidden" name="do" value="new">
    <center>
    <input type="submit" name="Submit" value="Login" />
    <input type="reset" name="reset" value="Reset" /><br/>
    </center>
	</div>
	<div id="navstrip"><div id="textmargin">Ticket Statistics</div></div>
	lovely stats here
	   <br/>
   	<div id="navstrip"><div id="textmargin">Ticket Statistics</div></div>
	Update: Ticket Deck re
   </div>
   <div id="copyright">
<center>Powered by <a href="#">Ticket Deck</a> v. 1.0 Beta 1</center>
</div>
   </div>
</div>
</body>

The CSS
Code:

body {
background: #f8f8f8;
color: #8a6600;
font: 12px verdana, arial, sans-serif;
margin: 0px;
padding: 0px;
}
a img {
border:0;
}
div#tlogo {
background-image: url(images/tlogo.gif);
width: 100%;
height: 25px;
}
div#logo {
background-image: url(images/logo.gif);
width: 197px;
height: 25px;
margin-left: 25px;
}

div#links {
height: 25px;
min-height: 25px;
width: 100%;
background-image: url(images/linksbg.gif);
padding: 0;
margin-top: 1px;
}

div#links ul {
list-style:none;
}
div#links ul li {
float:left;
}
div#header {
height: 51px;
}
div#container {
color: #ebba34;
height: 200px;
min-height: 100%;
width: 830px;
margin: auto;
}
* html #container {
height:100%;
}
*html #copyright {
position: absolute;
bottom: 0px;
}
div#date {
margin-right: 10px;
float:right;
}
div#nav {
color: #1b90b7;
border: 1px solid #61a5b9;
float: left;
width: 220px;
background: #e5f9ff;
}

div#navbar {
border: 1px solid #61a5b9;
width: 216px;
color: #1b90b7;
margin-left: 1px;
margin-right: 1px;
margin-top: 1px;
height: 23px;
background-image: url(images/nav.gif);
}

div#navstrip {
width: 100%;
background-image: url(images/nav.gif);
height: 23px;
border-top: 1px solid #1b90b7;
border-bottom: 1px solid #1b90b7;
}

div#textmargin {
margin-left: 2px;
margin-top: 4px;
}


div#textmargin1 {
margin-left: 2px;
margin-top: 6px;
}

div#tickets {
background: #ffebb3;
width: 602px;
border: 1px solid #e8af3a;
float: right;
}

div#tbar{
width: 598px;
background-image: url(images/t_bar.gif);
height: 23px;
border: 1px solid #e8af3a;
margin-left: 1px;
margin-right: 1px;
margin-top: 1px;
}

div#tcontain{
width: 599px;
height: 18px;
margin-left: 1px;
margin-right: 1px;
}
div#content {
width: 602px;
color: #8a6600;
float: right;
}

div#memberbar {
color: #1b90b7;
style: bold;
width: 80%;
height: 28px;
background: #e5f9ff;
border: 1px solid #61a5b9;
margin:auto;
}

div#toutline {
border: 1px solid #cde1ed;
}

#copyright {
text-align: center;
height:20px;
position: absolute;
bottom: 0px;
position: bottom;
}

table,
tr,
td {
	background: transparent;
	font-size: 12px;
	font-family: verdana, arial, sans-serif;
}

table th {
	background: #fadc89;
	font-size: 12px;
	font-family: verdana, arial, sans-serif;
	font-weight: normal;
	text-align: left;
	padding: 2px;
}

table th a {
	color: #003E67 !important;
	text-decoration: none;
}

Any help is appreciated . I know that this isn't valid xhtml I haven't gone that far in fixing it to make it valid, just trying to fix the obvious problems.

Thanks,
Brian