Tag: HTML

2008-09-05

Tabbed Ouput with Tidy

by Charles — Categories: HTML, PHP — Tags: , 3 Comments

In response to this thread at WebDeveloper.com, I came up with the idea of using PHP’s Tidy functions to format the HTML output from a script. The basic idea was to capture all the output by using ob_start() to buffer the output and then ob_get_clean() to save it to a variable. Then just run it through the tidy_repair_string() function with a couple configuration settings to indent it.


<?php
ob_start
();
?>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title>test</title>
</head>
<body>
<h1>Test</h1>
<ul>
<li>This is a test.</li>
<li>It is only a test.</li>
</ul>
</body>
</html>
<?php
$text
= ob_get_clean();
$config = array(
'indent' => true,
'indent-spaces' => 4
);
$text = tidy_repair_string($text, $config);
echo
$text;

But (more…)

2008-06-30

Clearing the Floats

by Charles — Categories: CSS, HTML — Tags: , , Leave a comment

No, this has nothing to do with the aftermath of the Macy’s Thanksgiving Day Parade. This is about that annoying thing with floated HTML elements within a container element, whereby it seems that said container has no inkling of the fact that it should expand enough vertically to contain any and all such floated elements.

I used to address this via the common Band-Aid of inserting a non-floated element just before the closing tag of the container, and giving that new element the clear: both; CSS property:

<div id='container'>
  <p class='float'>This element has a float:left or float:right;" style property.</p>
  <div class='clear'></div> <!-- "clear" class has the "clear:both;" style -->
</div>

But lo and behold, I recently discovered a simpler solution that does not require any extraneous, empty HTML mark-up, thanks to this article at  quirksmode.com. Now I can get rid of that semantically useless <div class='clear'></div> line in the above HTML, and instead just make sure the style for the “container” div includes:

#container {
  width: 100%;
  overflow: auto;
}
© 2012 PHP Musings All rights reserved - Wallow theme v0.46.4 by ([][]) TwoBeers - Powered by WordPress - Have fun!