Search code examples
htmlcsstagshtml-lists

While using nested <ul> and <ol> in HTML, I am facing problem with the line spacing


I am using very basic HTML for my college assignment, where I had to use nested <ul> and <ol>. All is okay, but there is just a problem of line spacing - as you can see in the image, the first <li>item in <ul> did not leave a line, like other elements, which ruins my format.

Is there any way to solve this without using CSS, or just 1-2 lines of it.

Code :

<!DOCTYPE html>
<html>
<head>      
<title>GEC Modasa </title>
</head> 
 <body>
 <ol>
 <li><b>COMPUTER ENGINEERING</b>
 <ol type = "a">
     <li>WEB DEVELOPMENT</li>
     <li>SOFTWARE ENGINEERING</li>
     <li>ADVANCED JAVA</li>
 </ol>
</li>      
     
 <li><b>INFORMATION TECHNOLOGY</b>
 <ol type = "I">
     <li>DISTRIBUTED OS</li>
     <li>IMAGE PROCESSING</li>
     <li>.NET</li>  
 </ol> </li> 

<li><b>CIVIL ENGINEERING</b>
<ul type="square">
    <li> APPLIED FLUID MECHANICS</li>
    <li>WATER & WATERWASTE ENGINEERING</li>
 </ul> </li> 
 
</ol>
   </body>
</html>

Output :

Output

It is solved. Just problem with my browser


Solution

  • I have copied your code and run it, everything is looking nice/ there is no error. May be I recommend you have to reRun your html code in a different browser, may be I recommend google chrome. If you want to to make a line space you can use the break statement,
    or .