Jump to content

Hello with positioning my list


Amazin

Recommended Posts

need help with my with HTML and CSS!I created a horizontal list under the header. My plan to cutomise it and make them look more fashionable. I might even move it inside the header! However for some reason they're out of position compare to other parts on the page. I want the list to be under "about".

 

 

#first ul li { display: inline;}

 

 

<div id="first"><ul><li><a href=#>p1</a></li><li><a href=#>p2</a></li><li><a href=#>p3</a></li><li><a href=#>p4</a></li></ul></div>

 

do you see anything wrong with my code? I don'tpinch.gif

 

inline_zpscd76ab18.png

 

 

 

 

 

 

 

 

 

Link to comment
Share on other sites

This would be my crude concept...

<!DOCTYPE html><html lang="en"><head><meta charset="utf-8"><title>title</title><style>*{margin:0;padding:0;}#first ul li{ display: inline;height:20px;border:1px solid #19F;border-radius:5px;/*list-style:none;*/margin:20px;background-color:#ddd;}#first ul li a{text-decoration:none;margin:150px 20px;}#header{height: 50px;background-color:#ddd;border:10px solid #19F;text-align:center;margin:20px;}#header h1 {color:#19F;}</style></head><body><div id="header"><h1>This is my world</h1></div><div id="first"><ul><li><a href=#>about</a></li><li><a href=#>p1</a></li><li><a href=#>p2</a></li><li><a href=#>p3</a></li><li><a href=#>p4</a></li></ul></div></body></html>
Link to comment
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now
×
×
  • Create New...