Long Word breaker
for really long words in HTML, there’s a way to break it.
http://www.hedgerwow.com/360/dhtml/css-word-break.html
Keep It Simple, Stupid
{ Category Archives }
for really long words in HTML, there’s a way to break it.
http://www.hedgerwow.com/360/dhtml/css-word-break.html
I did this for my co-worker, though it’s a rarely used function.
http://www.hedgerwow.com/360/dhtml/dom-ie7-zoom-detector.html
one of my co-workers asked the way to deploy grid-like layout for list-item with nice alignment and visual treatment.
Apparently a more flexible design and layout will make this better and old school CSS solution such as “float:left” won’thelp in the case.
I had a very simple prototype on :
http://www.hedgerwow.com/360/dhtml/css-inline-block-layout.php
you may try to adjust the font-size, window-size and see how this fluid layout adjust to your best-view-size and still keeps the UI looks nice and aligned well.
BTW, in case you may not notice the very inconvenient truth. Some might think that block Element s such as DIV does not get display:inline-block on Internet Explorer. This may not be true.
Here’s how do I implement display:inline-block across browsers:
‹style›
div{
width:100px;
height:100px;
background:red;
margin:1px;
display:-moz-inline-stack;/*Firefox need this to simulate display:inline-block*/
display:inline-block; /*IE does not apply this to Block Element, and Firefox does not render this, too*/
_overflow:hidden;/*fix IE6 to expanded content*/
zoom:1;/*trigger hasLayout*/
*display:inline;/*once hasLayout is true, set display:inline to block element will make display:inline behave like display:inline-block*/
}
‹/style›
‹div›1‹/div›
‹div›2‹/div›
One of the layout which designers love most and developers hate most is something looks like this:
http://www.hedgerwow.com/360/dhtml/css-layout-gridview.html
No time for documentation, just keep it simple for future usage.
I need to implement a table-like layout for major browsers.
so here’s my quick hack.
I knew it’s not perfect, but really simple ![]()
http://www.hedgerwow.com/360/dhtml/css-equal-column-layout.php
What round corners need is solution, not explanation!
I was thinking that if I can develop the more generic HTML markups
which look simpler for developers, but also be able to present more kinds of visual design elements on the page without bloating the performance and cost.
Here’s my experiment:
http://www.hedgerwow.com/360/dhtml/css_stretched_box/demo.php#
Have fun.
Now you can implement Frameset-Like Layout across all modern web browsers by CSS without writing any JavaScript codes.
This is a great tool for the Web developer to design CSS based frames layout on fly.
http://www.hedgerwow.com/360/dhtml/css-frameset-maker/index.php