-
Hamburger Menu With Bulma and Hyperscript
2023-07-27 "As part of a larger overhaul, I recently redid the navigation for this site and switched the CSS framework from Semantic UI to Bulma. The main reasons are that I find Bulma requires simpler HTML, and that it has no included JavaScript dependencies. JavaScript is needed for some features though, one of them being the burger menu.
Bulma has a
"navbarcomponent that automatically adapts to touchscreen devices by hiding thenavbar-menuitem. It also supplies a burger menu item,navbar-burger, that is shown when thenavbar-menuis hidden. -
Skeleton For Responsive Design
2012-01-10 "I just managed to get this site to display properly in a mobile browser with media queries, which means I am now among the cool responsive design kids.
If you, like me, use Skeleton, it turns out that you shouldn’t forget this line in your
head
":::css <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1"> -
1996 revisited
2009-04-15 "After receiveing what I believe was the third promotional email from my beloved mobile phone operator, showing this not-so-useful information
I was curious to see what sort of HTML did not even render images in Safari.
Behold:
#html <title>Sista chansen: Specialpris på Telia Mobilt bredband</title> <base target="_blank"> <HTML><HEAD> <META http-equiv=Content-Type content="text/html; charset=iso-8859-1"> <META content="MSHTML 6.00.5730.13" name=GENERATOR></HEAD> <BODY bgColor=#818177 leftMargin=0 topMargin=0 marginheight="0" marginwidth="0"> <TABLE height="100%" cellSpacing=0 cellPadding=0 width="100%" bgColor=#818177 border=0> <TR> <TD vAlign=top align=middle> <DIV style="FONT-WEIGHT: normal; FONT-SIZE: 10px; COLOR: #505050; FONT-FAMILY: Verdana, Arial, Helvetica, Sans-Serif">Ser mailet konstigt ut? <A style="FONT-WEIGHT: normal; FONT-SIZE: 10px; COLOR: #cf0566; FONT-FAMILY: Verdana, Arial, Helvetica, Sans-Serif" href="#" target=_blank>Klicka här »</A></DIV><BR> <TABLE cellSpacing=0 cellPadding=0 width=590 align=center bgColor=#aaaaa4 border=0> <TR> <TD vAlign=top align=middle><A href="http://tr.anp.se/track?t=c&mid=250386&uid=124849854&&&http://track.adform.net/C/?bn=212313" target=_blank><IMG alt="Nu höjer vi hastigheten och sänker priset." src="http://adata.attraction.se/Telia/buss14/09-Utskick_v15/images/erbj1.jpg" border=0></A></TD></TR> <TR> <TD vAlign=top align=middle><A href="http://tr.anp.se/track?t=c&mid=250386&uid=124849854&&&http://track.adform.net/C/?bn=212313" target=_blank><IMG alt="Nu höjer vi hastigheten och sänker priset." src="http://adata.attraction.se/Telia/buss14/09-Utskick_v15/images/erbj2.jpg" border=0></A></TD></TR> <TR> <TD vAlign=top align=middle><A href="http://tr.anp.se/track?t=c&mid=250386&uid=124849854&&&http://track.adform.net/C/?bn=212313" target=_blank><IMG alt="Nu höjer vi hastigheten och sänker priset." src="http://adata.attraction.se/Telia/buss14/09-Utskick_v15/images/erbj3.jpg" border=0></A></TD></TR> <TR> <TD vAlign=top align=middle><A href="http://tr.anp.se/track?t=c&mid=250386&uid=124849854&&&http://track.adform.net/C/?bn=212313" target=_blank><IMG alt="Nu höjer vi hastigheten och sänker priset." src="http://adata.attraction.se/Telia/buss14/09-Utskick_v15/images/erbj4.jpg" border=0></A></TD></TR></TABLE><BR> <DIV style="FONT-WEIGHT: normal; FONT-SIZE: 10px; COLOR: #505050; FONT-FAMILY: Verdana, Arial, Helvetica, Sans-Serif">Vill du inte få fler erbjudanden från Telia till denna epostadress, <A style="FONT-WEIGHT: normal; FONT-SIZE: 10px; COLOR: #cf0566; FONT-FAMILY: Verdana, Arial, Helvetica, Sans-Serif" href="http://www.anp.se/oa/250386/4342584B72474751437243465143" target=_blank>klicka här »</A></DIV></TD></TR></TABLE></BODY></HTML> <img border=0 width=1 height=1 src="http://www.anp.se/Clicks.asp?sqid=250386&sid=124849854&pf_action=View&pf_Link=">Wow - it is like a time machine to 1996. MSHTML did supposedly generate it.
" -
The closing of script tags
2008-03-11 "I found a bug in my HTML code today running Firefox 3.
<script>tags must supposedly be closed by a</script>and not by the less verbose but obviously wrong<script/>, as explained in this dismissed bug report.If you insist on using
"<script/>FF3 will punish you with a blank page caused by the body tag being self closed,<body/>. Sort of: “You close your script tags like that - I’ll close your damn body tag like that. Now, how do you like that???” -
YUI Grids
2007-12-13 "I had to straighten up the CSS for our public website, and I thought of looking into YUI Grids as I had heard lots of good things about it. It took me less than two hours to completely redo the layout, and the the end result was a better design, less custom CSS and better browser portability. I am a convert.
"