...

View Full Version : First Post! Some n00b Questions..



Supertribe
01-10-2008, 10:50 PM
Just starting on the web coding scene and I've already hit two problems, some help would be appreciated !

http://supertribe.c0n.us/Index.html
Yea, it's a horrible hosting but I'm not gonna pay for a domain + hosting at least until I know what I'm doing.

So, firstly when I add the moon image (which is added atm), my header and text get pushed down. How do I stop this?

Secondly, I've got an index.html in my directory, but when I got to http://supertribe.c0n.us/ I get the directory.. not the index. Why?

http://supertribe.c0n.us/styles.css

That's my CSS if it will help with the first problem.

jcdevelopment
01-10-2008, 11:01 PM
Where did you want the text to go? Do you want it to wrap the image or be at the top, im not sure i understand.

Supertribe
01-10-2008, 11:05 PM
I want it at the top.

jcdevelopment
01-10-2008, 11:08 PM
<h1>Tutorials 'n' Stuff</h1>
<p class="content">This is my first site, so bare with me as I try to include as much content as I can to learn HTML + CSS and take critism.</p>
<ul class="nav">
<img src="Images/Blue_Moon_Avatar.jpg" class="img" height="160" width="171">
<li><a href="Tutorials.html">Tutorials</a></li>
</ul>



Try that

vexen
01-10-2008, 11:28 PM
hey, take a look and try the following css along with the html :

what i did, included the image and the list in a sidebar and floating the sidebar to the left.

if you'd set the content div width to say 100% or X pixels (X being larger than the available space), it would drop down below.


#sidebar {
float:left;
width:200px
}
.nav {
width:171px;
text-align:center;
padding:0;
margin:0
list-style:none
}


<div id="sidebar">
<img src="Images/Blue_Moon_Avatar.jpg" class="img" height="160" width="171">
<ul class="nav">
<li><a href="http://supertribe.c0n.us/Tutorials.html">Tutorials</a></li>
</ul>
</div>
<div id="content">
<h1>Tutorials 'n' Stuff</h1>
<p>This is my first site, so bare with me as I try to include as much content as I can to learn HTML + CSS and take critism.</p>
</div>

i would not use capitals in filenames, especially not for the web, and Index.html / index.html are different files. same thing with your directory being Images.

rmedek
01-11-2008, 06:20 AM
Supertribe: Welcome to CF. In the future, please read the Posting Guidelines before starting a new thread. Specifically:


2) Type in a subject that summarizes your question- A great way to turn off other members wanting to help you is to type an incomplete or silly subject for your post. Examples of poor subject titles include:

- "Help!"
- "I'm a newbie...be gentle"
- "How can I..."
- "Urgent...deadline tomorrow!"

The above subjects either have absolutely nothing to do with the question itself, or are grossly incomplete (ie: "How can I..."). When asking for help, enter a subject that summarizes your question, period! Don't use silly, incomplete, or "bait" subjects. Some examples of good titles are:

- "How do I round a number to 2 decimal places using JavaScript?"
- "What's the difference between require() and include() in PHP?"
- "Can someone suggest a good, free HTML editor?"

Supertribe
01-11-2008, 07:51 PM
don't judge a book by it's cover as the saying goes..

thanks for the help guys, but it doesn't seem to work. the image remains at the top left, where i want it but I would like the heading + text beside it.

jcdevelopment
01-11-2008, 07:57 PM
try this




<img src="wherever.jpg" style="float:left; clear:left;">

Excavator
01-11-2008, 08:11 PM
Hello Supertribe,
I realize the validator is going to return some errors for the code your free host is adding but it can still be a useful tool both for learning and for developing your site. See the suggestion and links in my sig about validating.

It also freaks out when it sees your DocType is not the first line so, to best use it you will need to copy/paste your code into the "Validate by Direct Entry" (http://validator.w3.org/)box.

The validator will find things like .img {poistion: position:absolute; top:0%; border-style: solid; padding: 2px}


Maybe you should have a look at a good tutorial (http://www.imanthony.com/lesson1.php).

Supertribe
01-11-2008, 10:40 PM
thanks JC, worked like a charm.

i'll try that validater + read tutorial too excavator.

vexen
01-12-2008, 02:36 AM
Hello supertribe, considering i worked on the page on my hard drive and the result was there, i think you did not use the stylesheet i gave you. You could use it as external, or internal.

External Stylesheet, going inside <head> and </head>*tags :

<link rel="stylesheet" type="text/css" media="all" href="stylesheet.css" />

Internal Stylesheet, mostly used while developping, then can be moved to an external sheet (external sheets can be cached, thus saving bandwidth) :

<style type="text/css">
selector { property: attribute }
anotherSelector { property: attribute; anotherproperty: attribute }
</style>

you can consider reading this if this still does not make sense to you : http://www.w3schools.com/css/css_howto.asp



EZ Archive Ads Plugin for vBulletin Copyright 2006 Computer Help Forum