Jump to content

Indents between <li>


TheCatapult
 Share

Recommended Posts

Hello w3Schoolers, I just want to remove the indent between my <li> but I can't figure it out. Here is my code:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"><html xmlns="http://www.w3.org/1999/xhtml"><head><meta http-equiv="Content-Type" content="text/html; charset=utf-8" /><title>School Web</title><style type="text/css">#bodycss {background-color:#7a0026;}#wrapper{margin: 0 auto;width:768px;}.right{float:right}.left{float:left}.logo-banner{width768px;height:576px;background-color:#959595}.upper-navigation{width:768px;height:57px;}ul.navvv{list-style-type:none;margin:0;padding:0;overflow:hidden;}li{text-color:ffffff;} a.navvv{display:block;font-family:Arial;text-decoration:none;}.articles-left-nav{width:768px;height:1000px;}    .articles	 {width:480px;	 height:1000px;	 float:left;}			   .articles-news-header			   {width:480px;				 height:37px;}			    .articles-news-content			   {width:480px;			    height:463px;				 .articles-updates-header			    {width:480px;				  height:37px;}			    .articles-updates-content			   {width:480px;			    height:463px;    .left-nav	 {	 float:right;	  width:288px;	 height:1000px;}background-color:#ff00ff;} 					   .subdiv-time					    {width:288px;						  height:130px;}</style></head><body id="bodycss"><div id="wrapper"><div class="logo-banner"></div><div class="upper-navigation"><img src="Components/Images/upper-navigation/nav-home.jpg" alt="Home" width="153" height="57"><imgsrc="Components/Images/upper-navigation/nav-about.jpg" alt="About" width="153" height="57"><imgsrc="Components/Images/upper-navigation/nav-download.jpg" alt="Download" width="153" height="57"><imgsrc="Components/Images/upper-navigation/nav-forum.jpg" alt="Forum" width="153" height="57"><imgsrc="Components/Images/upper-navigation/nav-guides.jpg" alt="Guides" width="153" height="57"></div><div class="articles-left-nav">    <div class="articles">Hello</div>    <div class="leftnav"><ul class="navvv"><li><a href="default.asp"><img border="0" src="Components/Images/left-navigation/nav-register.jpg" alt="Register" width="288"height="71"></a></li><li><a href="default.asp"><img border="0" src="Components/Images/left-navigation/nav-gmprofile.jpg" alt="GM's Profiles" width="288"height="71"></a></li><li><a href="default.asp"><img border="0" src="Components/Images/left-navigation/nav-shop.jpg" alt="Cash Shop" width="288"height="71"></a></li><li><a href="default.asp"><img border="0" src="Components/Images/left-navigation/nav-vote.jpg" alt="Vote for us!" width="288"height="71"></a></li></ul></div></div>

I also have attached the snip shot of the said problem. Thank you very much!

post-78075-0-01729000-1364463361_thumb.jpg

Link to comment
Share on other sites

Thanks dsonseuk, but it still does not work. ------------------------ <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"><html xmlns="http://www.w3.org/1999/xhtml"><head><meta http-equiv="Content-Type" content="text/html; charset=utf-8" /><title>School Web</title> <style type="text/css">#bodycss {background-color:#7a0026;} #wrapper{margin: 0 auto;width:768px;} .right{float:right} .left{float:left} .logo-banner{width768px;height:576px;background-color:#959595} .upper-navigation{width:768px;height:57px;} ul.navvv{list-style-type:none;margin:0;padding:0;overflow:hidden;text-indent:0;}li.zerotext{text-color:ffffff;text-indent:0;} a.navvv{display:block;font-family:Arial;text-decoration:none;text-indent:0;} .articles-left-nav{width:768px;height:1000px;} .articles {width:480px; height:1000px; float:left;} .articles-news-header {width:480px; height:37px;} .articles-news-content {width:480px; height:463px; .articles-updates-header {width:480px; height:37px;} .articles-updates-content {width:480px; height:463px; .leftnav { float:right; width:288px; height:1000px;}background-color:#ff00ff;padding:0;margin:0;text-indent:0;} .subdiv-time {width:288px; height:130px;}</style> </head> <body id="bodycss"><div id="wrapper"> <div class="logo-banner"></div><div class="upper-navigation"><img src="Components/Images/upper-navigation/nav-home.jpg" alt="Home" width="153" height="57"><img src="Components/Images/upper-navigation/nav-about.jpg" alt="About" width="153" height="57"><img src="Components/Images/upper-navigation/nav-download.jpg" alt="Download" width="153" height="57"><img src="Components/Images/upper-navigation/nav-forum.jpg" alt="Forum" width="153" height="57"><img src="Components/Images/upper-navigation/nav-guides.jpg" alt="Guides" width="153" height="57"></div><div class="articles-left-nav"> <div class="articles">Hello</div> <div class="leftnav"><ul class="navvv"> <li class="zerotext"><a href="default.asp"><img border="0" src="Components/Images/left-navigation/nav-register.jpg" alt="Register" width="288" height="71"></a></li> <li class="zerotext"><a href="default.asp"><img border="0" src="Components/Images/left-navigation/nav-gmprofile.jpg" alt="GM's Profiles" width="288" height="71"></a></li> <li class="zerotext"><a href="default.asp"><img border="0" src="Components/Images/left-navigation/nav-shop.jpg" alt="Cash Shop" width="288" height="71"></a></li> <li class="zerotext"><a href="default.asp"><img border="0" src="Components/Images/left-navigation/nav-vote.jpg" alt="Vote for us!" width="288" height="71"></a></li></ul></div></div> -------------------------------------------- I have noticed also one thing: When I move the highlighted word let's say to this ------------------------ <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"><html xmlns="http://www.w3.org/1999/xhtml"><head><meta http-equiv="Content-Type" content="text/html; charset=utf-8" /><title>School Web</title> <style type="text/css">#bodycss {background-color:#7a0026;} #wrapper{margin: 0 auto;width:768px;} .right{float:right} .left{float:left} .logo-banner{width768px;height:576px;background-color:#959595} .upper-navigation{width:768px;height:57px;} .articles-left-nav{width:768px;height:1000px;} .articles {width:480px; height:1000px; float:left;} .articles-news-header {width:480px; height:37px;} .articles-news-content {width:480px; height:463px; .articles-updates-header {width:480px; height:37px;} .articles-updates-content {width:480px; height:463px; .leftnav { float:right; width:288px; height:1000px;}background-color:#ff00ff;padding:0;margin:0;text-indent:0;}ul.navvv{list-style-type:none;margin:0;padding:0;overflow:hidden;text-indent:0;}li.zerotext{text-color:ffffff;text-indent:0;} a.navvv{display:block;font-family:Arial;text-decoration:none;text-indent:0;} .subdiv-time {width:288px; height:130px;}</style> </head> <body id="bodycss"><div id="wrapper"> <div class="logo-banner"></div><div class="upper-navigation"><img src="Components/Images/upper-navigation/nav-home.jpg" alt="Home" width="153" height="57"><img src="Components/Images/upper-navigation/nav-about.jpg" alt="About" width="153" height="57"><img src="Components/Images/upper-navigation/nav-download.jpg" alt="Download" width="153" height="57"><img src="Components/Images/upper-navigation/nav-forum.jpg" alt="Forum" width="153" height="57"><img src="Components/Images/upper-navigation/nav-guides.jpg" alt="Guides" width="153" height="57"></div><div class="articles-left-nav"> <div class="articles">Hello</div> <div class="leftnav"><ul class="navvv"> <li class="zerotext"><a href="default.asp"><img border="0" src="Components/Images/left-navigation/nav-register.jpg" alt="Register" width="288" height="71"></a></li> <li class="zerotext"><a href="default.asp"><img border="0" src="Components/Images/left-navigation/nav-gmprofile.jpg" alt="GM's Profiles" width="288" height="71"></a></li> <li class="zerotext"><a href="default.asp"><img border="0" src="Components/Images/left-navigation/nav-shop.jpg" alt="Cash Shop" width="288" height="71"></a></li> <li class="zerotext"><a href="default.asp"><img border="0" src="Components/Images/left-navigation/nav-vote.jpg" alt="Vote for us!" width="288" height="71"></a></li></ul></div></div> -------------------------------------------- the menu gets bullets buttons. Why? Thanks!

Link to comment
Share on other sites

.leftnav{float:right;width:288px;height:1000px;} /*wrong*/background-color:#ff00ff;padding:0;margin:0;text-indent:0;} a.navvv{ /*I don't know what this is supposed to target, as there is no anchor link with this class */display:block;font-family:Arial;text-decoration:none;text-indent:0;} Edit: theres more .articles-news-content{width:480px;height:463px;} /*missing*/.articles-updates-content{width:480px;height:463px;;} /*missing*/

Edited by dsonesuk
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
 Share

×
×
  • Create New...