Posts Tagged ‘tableless’

Mens agitat molem

Monday, June 2nd, 2008

New and clean css layout: ORDES.RO, see more online on www.ordes.ro

ORDES.RO - Spiritul pune in miscare materia

Set 1px height for DIV’s in IE6

Wednesday, April 23rd, 2008

Another annoying problem with IE6!!! But, the solutions it’s very very simple. Just add in html code a “blank comment”.

css code:
.spacer {
height: 1px;
}

html code:
<div class="spacer"><!-- --></div><!-- end div spacer -->
Good luck!

:)

Project done!

Monday, November 19th, 2007

Here is my latest css compilation: vitalife.ro
Design was done by rogvaiv.com

… good night!

Sample code

DIV height based on other DIV heights, with JavaScript

Wednesday, September 19th, 2007

Here is the trick:
<script type="text/javascript" language="javascript">
function allocateSidebarHeight() {
var contentDom = document.getElementById("main");
var sidebarDom = document.getElementById("nav-one");
if((contentDom.offsetHeight - 800) > sidebarDom.offsetHeight) {
sidebarDom.style.height = (contentDom.offsetHeight - 800) + "px"; }
}
startList = function() {
if (document.all && document.getElementById) {
navRoot = document.getElementById("nav");
for (i = 0; i < navRoot.childNodes.length; i++) {
node = navRoot.childNodes[i];
if (node.nodeName == "LI") {
node.onmouseover = function() { this.className += " over"; }
node.onmouseout = function() { this.className = this.className.replace(" over", ""); } } } }
allocateSidebarHeight();
}
window.onload=startList;
</script>

Don’t forget to replace “main” and “nav-one” with your div’s.

Many thanks and reference to: http://www.nimaheydarian.com/2007/01/css-div-100-height-problem-solved/

If you have any troubles (IE/FF bugs, etc) write an e-mail to blog_at_pixiemag_dot_com.

DIVs auto height, based on content

Wednesday, August 22nd, 2007

How to have a DIV shrink and enlarge based on its content using CSS? Simple!!!

CSS file:
.autosize {
display: table;
width: 100px;
border: #333333 1px solid;
}
.content {
display: table-cell;
}

XHTML file:
<div class="autosize">
<div class="content">
My content!!! My content!!!
My content!!! My content!!!
</div>
</div>

You can go forward with this.
Good luck!



35 queries in 4.666 seconds.