Full address of your webpage August 7, 2008
Posted by Vicky in Webdeveloping.add a comment
For a print version of your webpage, it’s very useful to be able to include the full address of your page somewhere so that peple who print it out know where it has come from.
Simplified a bit from the Web Hosting Articles page:
<?php
// determine the domain using HTTP_HOST
$domain = $_SERVER['HTTP_HOST'];
//determine the URI using REQUEST_URI
$theuri = $_SERVER['REQUEST_URI'];
// concatenate to give the full URL
$url = "http://" . $domain . $theuri;
// output
echo $url;
?>
Save the above as ‘whereami.php’, then it can be included in another page using:
<div class="whereami">
<?php include 'whereami.php'; ?>
</div>
If you give this script its own css class, “whereami”, then if you make different css style-sheets for the print and the screen version of the page, you can hide the URL on the screen version by adding this line in your “screen” stylesheet:
.whereami{display:none;}
and just have it appear when you print by leaving this line out of the “print” stylesheet. See the Added Bytes article on printer friendly pages for advice on this.
CSS: Stop menu text breaking across a line August 1, 2008
Posted by Vicky in Computing, Webdeveloping.Tags: css html webpage
add a comment
Yesterday I was racking my brains to work out how to deal with this:
There are eleven items on this menu and if the window is made too small, English text breaks between words and Japanese text between characters in a single menu item. Although this behaviour is normal in paragraphs, it’s not suitable for menu items so, how to stop it?
I eventually found the answer after much searching:
white-space: nowrap; (W3schools documentation, Tizag.com tutorial)
(I had expected it to have the name word-wrap or text-wrap or something like that…)
With this attribute applied to the <li> tag, the menu appears as shown below. Now the word appears on the lower line rather than being broken across two. Hoorah!
NB: If applied to large chunks of text, white-space: nowrap; will make the text stick out beyond its containing box unless an overflow: scroll; or overflow: hide; attribute is also used, so white-space: nowrap; is best reserved for small menu items.