Go Back  HTML Forums - Free Webmaster Forums and Help Forums > WEBSITE DEVELOPMENT > HTML / XHTML
User Name:
Password:
 

Reply
Thread Tools   Display Modes
  View First Unread
 
Old 02-04-2004, 12:07 AM
  #1
jollyfactory
Deity (Level 17)
 
Join Date: Nov 2000
Location: Sydney, Australia
Posts: 775
iTrader: (0)
jollyfactory is on a distinguished road
Getting rid of space between lines of text

Hi, I have a list that is created using the following code:

Code:
<li> <strong>General Practitioners</strong></li>
<ul> 
<ul>
  <li>What you gain</li>
  <li>Highlights of the course</li>
</ul>
</ul>
My problem is, that between the lines "General Practitioners" and "What you gain", there is a really large gap. I've taken a screen shot of this to show you what I mean. The section is what I have highlighted with the red arrow here: http://resma.net/a.GIF

I think it's possible to get rid of this using CSS but i have no idea how. I think it's got something to do with margin-top:0; margin-bottom:0; however, I do not know where to implement this code.

Any helps is much appreciated.

Thankyou
__________________

The website said: Please Use Internet Explorer 6 or better for our site ... so I used Netscape
jollyfactory is offline   Add to del.icio.us Add to del.icio.us    Can you digg it?Can you digg it? Reply With Quote
Old 02-04-2004, 01:49 AM
  #2
Bradyn
Soldier (Level 11)
 
Join Date: Jan 2004
Location: Canada
Posts: 150
iTrader: (0)
Bradyn is on a distinguished road
Try this:
Code:
<ul>
 <li><strong>General Practitioners</strong></li>
 <li>
  <ul>
   <li>What you gain</li>
   <li>Highlights of the course</li>
  </ul>
 </li>
</ul>
Bradyn is offline   Add to del.icio.us Add to del.icio.us    Can you digg it?Can you digg it? Reply With Quote
Old 02-04-2004, 03:40 PM
  #3
scoutt
Mister Admin to you
 
scoutt's Avatar
 
Join Date: Jul 2001
Posts: 33,125
iTrader: (0)
scoutt is a glorious beacon of lightscoutt is a glorious beacon of lightscoutt is a glorious beacon of lightscoutt is a glorious beacon of lightscoutt is a glorious beacon of light
you list is all messed up Jolly.

Code:
<ul>
<li> <strong>General Practitioners</strong></li>
</ul> 
<ul>
  <li>What you gain</li>
  <li>Highlights of the course</li>
</ul>
__________________
Have a Script or Snippet you want to share?

WWW Standards: HTML 4.01,
HTML 5, CSS2.1, CSS3, XHTML 1.0
PHP Standards: PHP Standards
scoutt is offline   Add to del.icio.us Add to del.icio.us    Can you digg it?Can you digg it? Reply With Quote
Old 02-04-2004, 04:36 PM
  #4
Pegasus
Mama Hen
 
Pegasus's Avatar
 
Join Date: Nov 2001
Location: 35 South of Santa Claus
Posts: 26,643
iTrader: (0)
Pegasus has much to be proud ofPegasus has much to be proud ofPegasus has much to be proud ofPegasus has much to be proud ofPegasus has much to be proud ofPegasus has much to be proud ofPegasus has much to be proud ofPegasus has much to be proud ofPegasus has much to be proud of
I'm not sure the problem is the text box, Jolly. I think I see what you're looking to do, but you've got an extra list in there that might be creating the space.

You have two sets of lists, right? One that lists the main topics and one that lists the contents for each topic.I'm assuming you're using an ordered list for the main topics. Try removing the sections in red from your unordered lists.
Code:
<ol><li> <strong>General Practitioners</strong></li>
<ul> 
<ul>
  <li>What you gain</li>
  <li>Highlights of the course</li>
</ul>
</ul> 
The next sections would read like this (the </ol> would only be on the last item in the list)?
Code:
<li> <strong>Next Section</strong></li>
<ul>
  <li>First Detail</li>
  <li>Second Detail</li>
</ul>
</ol>
The only other way I can think of to reduce the space might be to change the line heights for your lists.

ol ul { line-height: 110%; font-size: 10px; }

I believe that 'normal' line heights use a value of 120%. For a font size of 10px, that puts 2px worth of space between the lines, one above the text and one below. The number of pixels between the lines would be different for different sizes, but that's the basic idea.

Does that help?

Peg
Pegasus is offline   Add to del.icio.us Add to del.icio.us    Can you digg it?Can you digg it? Reply With Quote
Old 02-04-2004, 06:11 PM
  #5
Bradyn
Soldier (Level 11)
 
Join Date: Jan 2004
Location: Canada
Posts: 150
iTrader: (0)
Bradyn is on a distinguished road
http://bradyn.onehorsetown.ca/

Code:
<html>
<head>
<title></title>
<style type="text/css">
body { color: #000; background-color: #fff; font-family: Courier New; font-size: 12px; }
a { color: #009; }
</style>
</head>
<body>

contact: <a href="mailto:bradyn@onehorsetown.ca">bradyn@onehorsetown.ca</a>
<br /><br />
age: 16<br />
sex: male<br />
location: calgary, canada<br /><br />
<br />
<a href="http://www.onehorsetown.ca/">OHT</a>

<ul>
<li>title</li>
<ul>
<li>list item</li>
<li>list item 2</li>
</ul>
</ul>

</body>
</html>
Bradyn is offline   Add to del.icio.us Add to del.icio.us    Can you digg it?Can you digg it? Reply With Quote
Reply
KEEP TABS
SPONSORS
 
Boxedart

 
 


 
Currently Active Users Viewing This Thread: 1 (0 members and 1 guests)
 
  
 
 
 



 
  POSTING RULES
 
 
You may not post new threads
You may not post replies
You may not post attachments
You may not edit your posts
vB code is On
Smilies are On
[IMG] code is On
HTML code is Off
Thread Tools
Display Modes

Forum Jump

 

All times are GMT -5. The time now is 06:12 AM.

   

Mascot team created by Drawshop.com | Web Hosting

Powered by vBulletin® Version 3.6.7
Copyright ©2000 - 2014, Jelsoft Enterprises Ltd.

Server Monitoring by ENIACmonitor 0.01
HTMLforums.com © Big Resources, Inc. Web Design by BoxedArt.com
vRewrite 1.5 beta SEOed URLs completed by Tech Help Forum and Chalo Na.