CODEWITHSUNDEEP
html
leechyeah
leechyeah

Reputation: 91

How do I stop HTML from flowing out my div?

I have a small search engine for my news articles on my website, all stored on MySQL. These news articles are using HTML formatting: e.g. a href, b, u, etc....

When I search an article I made it only the first 100 characters are displayed, as in a preview. However, some articles stop before the closing HTML tags are declared.

This creates a mess when viewing the search results as the HTML formatting is inaccurate.

How do I stop HTML from flowing out my searchResults div?

Should I create an iFrame?

Lee.

Upvotes: 0

Views: 132

Answers (2)

Jakub
Jakub

Reputation: 20475

If I understand you are having problems because instead of 100 characters of preview you get 100 characters of HTML tags?

I would for the preview strip out all tags (a href, etc) like so:

<?php
   $preview = '<h1>This is a title</h1><b>Hello</b> this is a result from search';
   echo strip_tags($preview);
?>

The result would just be clean text, without html.

This is a title Hello this is a result from search

reference: http://php.net/manual/en/function.strip-tags.php

Upvotes: 0

Borealid
Borealid

Reputation: 98459

I'd recommend inserting the entire article into your DOM (dynamically fetched so as to not slow the page load time), and using CSS overflow properties to truncate it as you like. That will also allow you to do things like showing a (more) complete preview on hover.

The truncation is a concern of the display layer - conceptually, the preview is limited to the size of the preview box. So you shouldn't be applying it at the model layer.

Most people who implement these sorts of previews other ways do it via a manually written summary or don't allow arbitrary HTML (BBCode is popular).

Another option is to actually parse the article before truncation, and be gentler with it to maintain the well-formedness of your page.

And yes, a frame is theoretically a choice.

Upvotes: 1

Related Questions