Divs can be used to organise areas of a webpage, can be used to hide or show when a pull down is changed, or a screen is resized, can be made to float around or flow around text.
Divs are similar to Spans but they usually have a break after them, you can make them inline like spans by making the display parameter inline.
To remove the break or newline after a div use:
eg
#TheTopDiv {display: inline}
<div id="TheTopDiv" class="rounded"><a href="http://AdFos.com">Adam Foster</a></div>
or
<div id="TheTopDiv" style="display: inline"><a href="http://AdFos.com">Adam Foster</a></div>
If you want a div to be invisible on loading:
<div id='checkStockDiv' style='display:none; visibility:hidden;'> whatever </div>
To Hide a div try this javascript function:
function hide(divId) {
if (window.document.getElementById) { // DOM3 = IE5, NS6
//alert(divId);
window.document.getElementById(divId).style.display = 'none';
}
else {
if (document.layers) { // Netscape 4
document.divId.display = 'none';
}
else { // IE 4
window.document.all.divId.style.display = 'none';
}
}
}
To show a div try this javascript function: NB change to "block" in stead of inline if you want the break after.
function show(divId) {
if (window.document.getElementById) { // DOM3 = IE5, NS6
window.document.getElementById(divId).style.display = 'block';
window.document.getElementById(divId).style.visibility = 'visible';
}
else {
if (document.layers) { // Netscape 4
document.divId.display = 'block';
}
else { // IE 4
window.document.all.divId.style.display = 'block';
}
}
}
To make the div float to the right try:
<div id="TheTopDiv" style="float:right"><a href="http://AdFos.com">Adam Foster</a></div>
To make text look more spaced in a div try this:
<div STYLE="text-align: justify; text-justify: newspaper; padding-left:20px; padding-right:20px; line-height:18px;">lots of text</div>
or a grey background with padding:
<div style="padding:5px 5px 5px 6px; background-color:#222222;" > lots of text</div>
or to add a black border:
<div style="border:3px solid #000000"> border</div>