Simple PHP Script Not Working

Mixing url title with description in <li>

[jimh009]

Hi,

I thought this would be the world's easiest php script, but right now it is kicking my butt. Hoping someone might be able to help solve this strange problem.

Basically, I'm pulling info from a database to display select info to put inside a <ul><li></li></ul>.

Inside each URL, there is the "Title"...which has a URL link and is bolded. Then there's suppose to be a space, an : or - , another space, and then the "Description", which is normal text.

All works fine, except that the "Description" is starting on a new line below the "Title". I want to have the individaul <li> display this all on one line (and automatically text-wrap if need be).

Here's the code I'm using.

     <!-- Begin Menu -->
     <nav class="widget">
      <h4>Introductory Title</h4>
      <ul class="categories" id="menu-lists">
      
<?php 
$query = 'SELECT * FROM `TABLE_NAME` 
WHERE category = "CATEGORY_NAME" 
ORDER BY RAND() Limit 5';

$results = mysql_query($query)
or die(mysql_error());
?>      
<?php 
    while ($row = mysql_fetch_array($results)){
extract($row);

 echo "<li><a href=$Link class='class_name_to_bold'>$Title</a> - $Short_Description</li>";
}
?>
     <li><a href="url_goes_here.php" class="class_for_bold_text">View All Articles Etc...</a></li>
      </ul>
<span class="class_name"><hr /></span>
</nav>

So what's am I - a total novice PHP coder - doing wrong here? I really thought this would be such an oh so simple script!

[topr8]

what is the actual code as seen in the 'view page source' when the page is created.
this doesn't look to be a php issue, the description isn't wrapped in <p> tags or something in th edatabase or is there some weird css stying going on?

[jimh009]

Yeah, that was the first thing I checked too.

The source code looks perfectly normal, except that the li's extend horizontally across the page. Instead of the li's being nested beneath each other, in the source code the li's are next to each other horizontally. But there's no weird spacing.

Edited to add that there's no <P> tags involved. And I can't see any sort of conflict with CSS, either. Such a simple thing has me totally stumped. Argh.

[whitespace]

As topr8 suggests, you need to check the generated HTML source code and work backwards. After all, it is only the HTML/CSS that controls the positioning on the rendered page. By checking the resulting page in the browser's "object inspector" you should be able to see what is controlling the positioning of elements.

A wild guess would be that anchors (in this context) are display:block? Or white-space is preserved? Or a containing block is restricting the width? Etc...

(It may not be strictly necessary, but I would include quotes around the HREF attribute's value.)

[topr8]

as whitespace has said too ...

you need to check your css file, especially:
.categories
#menu-list

[jimh009]

Thanks for your help. It was some strange conflicting CSS...I still don't know where. So I started fresh and it all now works. :)