...

View Full Version : A little help



Decker
08-24-2010, 11:23 PM
Alright i've came across ANOTHER problem. When I type stuff, it goes under the left nav, I want it to go under the content area, can someone help me do that?

http://img691.imageshack.us/img691/5895/89505935.jpg

index.html

<html>
<head>
<title>Conquer Website</title>
<link rel="stylesheet" type="text/css" href="style.css">
</head>

<div id="container">

<div id="header"><center><font size="5" valign="middle">Banner</font></div>

<br />

<div id="leftbar"><center>Navigation</center> </div>

<div id="rightbar"> <center>Server Status</center></div>

<center><div id="content"><center>Content</center></div></center>

</div>

</body>
</html>

style.css

body {
background-color: #565656;
font-family: System;
}

#container {
width: 600px;
padding: 1px;
margin: 43px auto 0;
}

#header {
width: 600;
height: 100;
background-image:url(images/header.jpg);
}

#leftbar {
width: 150;
height: 20;
background-image:url(images/bar.jpg);
float: left;
}

#rightbar {
width: 150;
height: 20;
background-image:url(images/bar.jpg);
float: right;
}

#content {
width: 275;
height: 20;
background-image:url(images/content.jpg);
}

teedoff
08-25-2010, 12:18 AM
You shouldn't need the <center> tags to center your divs. Thats done with css positioning, which you should already have. The float left attribute "floats" the div left so that divs underneath can move up beside the div immediately to the left. Then once they are floated side by side, use margins to specify where they appear horizontally. Remember, html was intended to be a desciptive language, CSS is the coding used for presentation(styling). Not an answer to your current question, but hope it helps nonetheless.

Also, as someone pointed out in another post of your's, make sure you specify the type of width measurements.

#content {
width: 600; 600 what? pixels or ems?

}

Only 0 can be left at just 0.

Decker
08-25-2010, 12:40 AM
You shouldn't need the <center> tags to center your divs. Thats done with css positioning, which you should already have. The float left attribute "floats" the div left so that divs underneath can move up beside the div immediately to the left. Then once they are floated side by side, use margins to specify where they appear horizontally. Remember, html was intended to be a desciptive language, CSS is the coding used for presentation(styling). Not an answer to your current question, but hope it helps nonetheless.

Also, as someone pointed out in another post of your's, make sure you specify the type of width measurements.

#content {
width: 600; 600 what? pixels or ems?

}

Only 0 can be left at just 0.

Where did you get that at?

teedoff
08-25-2010, 01:04 AM
#header {
width: 600;
}


same thing. You must specify 600 what? 200 what? Should be 600px or 200px.

Decker
08-25-2010, 01:15 AM
It's working as pixels I assume. But i'm not writing it, but it's still working. But do you know how to fix my problem?

teedoff
08-25-2010, 02:50 PM
Ok not following you. Where are you "typing stuff" and where are you wanting it to go? You say your typing stuff and its going "under" the left nav. If you want content in a particular div, you type within that div container. For example:

<div id="header">
<h1>Hello this is Decker<h1>
</div>

bazz
08-25-2010, 03:44 PM
you also need to start to use a doctype so the browser knows how you want it to display the site.



It's working as pixels I assume. But i'm not writing it, but it's still working. But do you know how to fix my problem?


You can't assume anything. If you do, you enable some browsers to show your site one way and others in a totaly broken way. use pt, px or em as the unit.

And why not validate your page as valiadtor.w3.org. If your code has no errors, it'll be much easier to find solutions to problems.

bazz

Decker
08-25-2010, 04:11 PM
you also need to start to use a doctype so the browser knows how you want it to display the site.



You can't assume anything. If you do, you enable some browsers to show your site one way and others in a totaly broken way. use pt, px or em as the unit.

And why not validate your page as valiadtor.w3.org. If your code has no errors, it'll be much easier to find solutions to problems.

bazz

I just started learning CSS yesterday. I made my first website yesterday too (with the help of codingforums.com). What does validating my code mean? That site you gave me doesn't work.

To the topic. How can I make it so that I can type stuff directly underneath the bars?

teedoff
08-25-2010, 04:57 PM
Those aren't "bars" they are your divs. Think of them as boxes that you can put stuff INSIDE them. They just happen to be colored blue I guess because you have a background image specified. Read my last post here above. You can type text in paragraphs or h1 - h6 header tags or add an ordered list or unordered list INSIDE your divs.


What does validating my code mean?

Good well structured html and css needs to be correct. The W3C code validator lets you know if your code is adhering to standards and what the errors may be. If you have your site/page already on the web (live), then you can simply type the URL into the code validator. If not then you can copy and paste your raw code into the html raw code validator as well.

Now I dont know how or where you are learning html and css from, but you should check out www.w3schools.com. They have excellent tutorials on html and css and many other subjects. All free. You should spend a few days there to familiarize yourself with the basics of page structure ie <div>

bazz
08-25-2010, 11:59 PM
oops, I spelt it wrongly. validator.w3.org



EZ Archive Ads Plugin for vBulletin Copyright 2006 Computer Help Forum