School Assignment? Project Due Tomorrow? Chat LIVE With A Programming Expert!
You're Browsing As A Guest! Register Now...
Become an Expert!

Join 353,887 Programmers for FREE! Get instant access to thousands of experts, tutorials, code snippets, and more! There are 3,187 people online right now.Registration is fast and FREE... Join Now!



List Alignment

Page 1 of 1

List Alignment what am I doing wrong??

#1 Addio569  Icon User is offline

  • D.I.C Head
  • PipPip

Reputation: 1
  • View blog
  • Posts: 160
  • Joined: 26-November 08


Dream Kudos: 0

Posted 09 March 2009 - 01:41 PM

my css started originally as a header, left column, content and footer. I have taken out the left column as I was having problems.
what I need to know is where I now put my list as it was originally in the left column, I've put it in the content part but I cant align it to the left.

if its in the right place how do I align it to the left?

if it is in the right place where do I put it and how do I lighn it to the left?

thanks

here is my code:
<html>
<head>
<title>Contact Me</title>
<link rel="stylesheet" type="text/css" href="mycss2.css"/>
</head>
<body>
<div id="header">
   <h1>Contact Me</h1>
</div>
	
</div>
<div id="content">

<ol type= "I">
	   <li><a href="First%20Page.html">HOME</a></li>
	   <li><a href="Second%20Page.html">2ND PAGE</a></li>
	   <li><a href="Third%20Page.html">3RD PAGE</a></li>
	   <li><a href="Fifth%20Page.html">5TH PAGE</a></li>
	</ol>

</div>
<center>
<div id="footer">The material featured on this website is subject to Crown copyright protection unless otherwise indicated. The protected material may be reproduced 

free of charge in any format or medium for research or private study.</div>
<Center>
</body>
</html>


and here is my css:

p {font-family: "Comic sans ms", serif;
   font-size: 15pt;
   margin-left: 15px;
   color:white;}
   
h1 {font-family: "lucida handwriting italic", Helvetica, sans-serif;
	font-size: 30pt;
	color: White;
	text-align: center;}

h2 {font-family: "century gothic", Helvetica, sans-serif;
	font-size: 20pt;
	color: red;
	text-align: center;}

li {font-family: "comic sans ms", Helvetica, sans-serif;
	font-size: 12pt;
	color: red;
	text-align: center;}


a:link {color:white} 
a:visited {color:red} 
a:hover {color:Green} 
a:active {color:yellow} 


#header  {
   background-color: #000000;
   position: absolute;
   top: 0px;
   left: 0px;
   width: 1350px;
   height: 200px;
}
#content   {
   background:  #000000;
   position:  absolute;
   top: 150px;
   left: 0px;
   width: 1350px;
   height: 850px;

}
#footer   {
   font-family: "Ariel", Helvetica, sans-serif;
   background: #FF0066;
   position:  absolute;
   top: 1000px;
   left: 0px;
   width: 1350px;
   height: 80px;
}

Was This Post Helpful? 0
  • +
  • -

#2 CTphpnwb  Icon User is offline

  • D.I.C Lover
  • Icon

Reputation: 201
  • View blog
  • Posts: 2,352
  • Joined: 08-August 08


Dream Kudos: 100
Expert In: PHP

Re: List Alignment

Posted 09 March 2009 - 04:13 PM

In css, content:

text-align: left;
Was This Post Helpful? 0
  • +
  • -

#3 Addio569  Icon User is offline

  • D.I.C Head
  • PipPip

Reputation: 1
  • View blog
  • Posts: 160
  • Joined: 26-November 08


Dream Kudos: 0

Re: List Alignment

Posted 09 March 2009 - 04:45 PM

View PostCTphpnwb, on 9 Mar, 2009 - 04:13 PM, said:

In css, content:

text-align: left;


where abouts do I put that?

Thanks
Was This Post Helpful? 0
  • +
  • -

#4 ericr2427  Icon User is offline

  • D.I.C Regular
  • Icon

Reputation: 21
  • View blog
  • Posts: 303
  • Joined: 01-December 08


Dream Kudos: 150

Re: List Alignment

Posted 09 March 2009 - 05:16 PM

In the css, in #content {} add text-align: left;
Was This Post Helpful? 0
  • +
  • -

#5 CTphpnwb  Icon User is offline

  • D.I.C Lover
  • Icon

Reputation: 201
  • View blog
  • Posts: 2,352
  • Joined: 08-August 08


Dream Kudos: 100
Expert In: PHP

Re: List Alignment

Posted 09 March 2009 - 07:47 PM

If you want content left justified, you need to set content.
 #content   {
   background:  #000000;
   position:  absolute;
   top: 150px;
   left: 0px;
   width: 1350px;
   height: 850px;
   text-align: left;

}

Was This Post Helpful? 0
  • +
  • -

#6 Addio569  Icon User is offline

  • D.I.C Head
  • PipPip

Reputation: 1
  • View blog
  • Posts: 160
  • Joined: 26-November 08


Dream Kudos: 0

Re: List Alignment

Posted 10 March 2009 - 07:52 AM

View PostCTphpnwb, on 9 Mar, 2009 - 07:47 PM, said:

If you want content left justified, you need to set content.
 #content   {
   background:  #000000;
   position:  absolute;
   top: 150px;
   left: 0px;
   width: 1350px;
   height: 850px;
   text-align: left;

}


I've done that but it doesn't seem to work!
Was This Post Helpful? 0
  • +
  • -

#7 CTphpnwb  Icon User is offline

  • D.I.C Lover
  • Icon

Reputation: 201
  • View blog
  • Posts: 2,352
  • Joined: 08-August 08


Dream Kudos: 100
Expert In: PHP

Re: List Alignment

Posted 10 March 2009 - 09:45 AM

:D
How about not defining li to be centered?
li {font-family: "comic sans ms", Helvetica, sans-serif;
		font-size: 12pt;
		color: red;
		text-align: center;}

should be:
li {font-family: "comic sans ms", Helvetica, sans-serif;
		font-size: 12pt;
		color: red;
		text-align: left;}

Was This Post Helpful? 0
  • +
  • -

#8 Addio569  Icon User is offline

  • D.I.C Head
  • PipPip

Reputation: 1
  • View blog
  • Posts: 160
  • Joined: 26-November 08


Dream Kudos: 0

Re: List Alignment

Posted 10 March 2009 - 12:22 PM

View PostCTphpnwb, on 10 Mar, 2009 - 09:45 AM, said:

:D
How about not defining li to be centered?
li {font-family: "comic sans ms", Helvetica, sans-serif;
		font-size: 12pt;
		color: red;
		text-align: center;}

should be:
li {font-family: "comic sans ms", Helvetica, sans-serif;
		font-size: 12pt;
		color: red;
		text-align: left;}


Ha Ha! How stupid do I look/Feel!

Thanks
Was This Post Helpful? 0
  • +
  • -

#9 Addio569  Icon User is offline

  • D.I.C Head
  • PipPip

Reputation: 1
  • View blog
  • Posts: 160
  • Joined: 26-November 08


Dream Kudos: 0

Re: List Alignment

Posted 10 March 2009 - 12:38 PM

Now I've got another Problem!

I was able to left align my list with no problem.

I now want to change it to a Drop down menu, here is my code:
<html>
<head>
<title>About Me</title>
<link rel="stylesheet" type="text/css" href="mycss2.css"/>
</head>
<body>
<div id="header">
<h1>About Me</h1>
<
<div id="content">

meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<link rel="stylesheet" href="flyout.css" type="text/css" />
<script type="text/javascript" src="flyout.js"></script>
<left>
<div id="wrapper">
  <dl class="dropdown">
	<dt id="one-ddheader" class="upperdd" onmouseover="ddMenu('one',1)" onmouseout="ddMenu('one',-1)">Menu</dt>
	<dd id="one-ddcontent" onmouseover="cancelHide('one')" onmouseout="ddMenu('one',-1)">
	  <ul>
		<li><a href="Second%20Page.html"" class="underline">2nd Page</a></li>
		<li><a href="Third%20Page.html"" class="underline">3rd Page</a></li>
		<li><a href="Fourth%20Page.html"" class="underline">4th Page</a></li>
		<li><a href="fifth%20Page.html"" class="underline">5th Page</a></li>
	  </ul>
	</dd>
  </dl> 
<left>
   
</div>
<center>
<div id="footer">The material featured on this website is subject to Crown copyright protection unless otherwise indicated. The protected material may be reproduced 

free of charge in any format or medium for research or private study.</div>
<Center>
</body>
</html>


It won't left align! I tried adding a dl to the css but that didn't work, (I tried adding <left> as you can see) and that didnt work, how do I align it to the left?

also I have my heading to the left but how do I bring it out a bit so that its not dead to the left?

Thanks
Was This Post Helpful? 0
  • +
  • -

#10 CTphpnwb  Icon User is offline

  • D.I.C Lover
  • Icon

Reputation: 201
  • View blog
  • Posts: 2,352
  • Joined: 08-August 08


Dream Kudos: 100
Expert In: PHP

Re: List Alignment

Posted 10 March 2009 - 12:54 PM

The dl tag is not for drop down menus:
http://www.w3schools...TAGS/tag_dl.asp

I think you want a form with options. That can be done server side with php/html or using javascript/html.
Was This Post Helpful? 0
  • +
  • -

#11 Addio569  Icon User is offline

  • D.I.C Head
  • PipPip

Reputation: 1
  • View blog
  • Posts: 160
  • Joined: 26-November 08


Dream Kudos: 0

Re: List Alignment

Posted 10 March 2009 - 01:00 PM

View PostCTphpnwb, on 10 Mar, 2009 - 12:54 PM, said:

The dl tag is not for drop down menus:
http://www.w3schools...TAGS/tag_dl.asp

I think you want a form with options. That can be done server side with php/html or using javascript/html.


Its what I was given in a lecture slide. thats what I wanted just need to align it to the left,can this be done?

Thanks
Was This Post Helpful? 0
  • +
  • -

#12 Addio569  Icon User is offline

  • D.I.C Head
  • PipPip

Reputation: 1
  • View blog
  • Posts: 160
  • Joined: 26-November 08


Dream Kudos: 0

Re: List Alignment

Posted 11 March 2009 - 02:18 PM

any more input on this one guys??

Thanks
Was This Post Helpful? 0
  • +
  • -

#13 CTphpnwb  Icon User is offline

  • D.I.C Lover
  • Icon

Reputation: 201
  • View blog
  • Posts: 2,352
  • Joined: 08-August 08


Dream Kudos: 100
Expert In: PHP

Re: List Alignment

Posted 11 March 2009 - 06:01 PM

It can be done, but not using the dl tag, which as is pointed out in the link I provided:

Quote

The <dl> tag defines a definition list.

You want to use a form with options:
http://www.w3schools.../tag_select.asp
Was This Post Helpful? 0
  • +
  • -

#14 Jamie2993  Icon User is offline

  • New D.I.C Head
  • Pip

Reputation: 0
  • View blog
  • Posts: 7
  • Joined: 12-March 09


Dream Kudos: 0

Re: List Alignment

Posted 13 March 2009 - 02:50 PM

If i was to align something to left (for some reason) i would put this in html:
<div class="left">
My Stuff
</div>

In the css:
.left {
float: left;
}

I would do it that was =) but i dont know if u need this anymore.
Was This Post Helpful? 0
  • +
  • -
Page 1 of 1

Fast Reply

  

1 User(s) are reading this topic
0 members, 1 guests, 0 anonymous users



Live Help!

Be Social

Dream.In.Code RSS Feed Dream.In.Code LinkedIn Group Follow Us On Twitter Fan Us On Facebook

Tutorials

Programming

Web Development

Reference Sheets

Code Snippets

DIC Chatroom

Bye Bye Ads

Monthly Drawing

Thumb Drive

Top Contributors

Top 10 Kudos This Month

Programming Help

Web Development



What's Here?

  • Members: 353,887
  • Replies: 956,798
  • Topics: 161,556
  • Snippets: 4,968
  • Tutorials: 1,307
  • Total Online: 3,187
  • Members: 106
  • Guests: 3,081