/    Sign up×
Community /Pin to ProfileBookmark

[RESOLVED] default <div> height

Copy linkTweet thisAlerts:
Apr 08.2008

Is there a way to determine the height of a <DIV> area
when it is not defined in the CSS section?

I’m looking to see what the default values are when created.

to post a comment
JavaScript

4 Comments(s) ↴

Copy linkTweet thisAlerts:
@mrhooApr 08.2008 — element.offsetHeight returns an integer (pixels), as long as the element is in the document and does not have its display property set to 'none'.

Its height depends on its content- an empty div may return 0, unless there is default padding.
Copy linkTweet thisAlerts:
@JMRKERauthorApr 08.2008 — Thank you. ?

I think I can use that information to my benefit.
Copy linkTweet thisAlerts:
@fredmvApr 08.2008 — This is kinda' tricky, but very possible. You'll want to look at the so-called AbstractView of the document, as defined here: http://developer.mozilla.org/en/docs/DOM:document.defaultView which ends up being document.defaultView.

Since you're looking for properties that are not hard-coded' into the element (as the style' property would yield), and are either a.) defaulted to in the browser, or b.) applied to the element via inline <style> tags or an external stylesheet (i.e. @imported), you must look at the document after the styles have been 'computed' by the browser in question, and so this kind of notation should work: http://www.webdeveloper.com/forum/showthread.php?t=25930
Copy linkTweet thisAlerts:
@JMRKERauthorApr 09.2008 — Here's how I solved my problem. Thank's to all for the help. ?

Look in the first <script> as the rest is just filler to show it's actions.
[code=php]
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
<meta http-equiv="pragma" content="no-cache">

<title>Pseudo-Site Map</title>

<script language="JavaScript" type="text/JavaScript">

function getElementsByClass(searchClass,node,tag) {
var classElements = new Array();
if ( node == null )
node = document;
if ( tag == null )
tag = '*';
var els = node.getElementsByTagName(tag);
var elsLen = els.length;
var pattern = new RegExp("(^|\\s)"+searchClass+"(\\s|$)");
for (i = 0, j = 0; i < elsLen; i++) {
if ( pattern.test(els[i].className) ) {
classElements[j] = els[i];
j++;
}
}
return classElements;
}

function setHmax(a,b,c,d) {
var maxH = 0;
maxH = Math.max(maxH,document.getElementById(a).offsetHeight);
maxH = Math.max(maxH,document.getElementById(b).offsetHeight);
maxH = Math.max(maxH,document.getElementById(c).offsetHeight);
maxH = Math.max(maxH,document.getElementById(d).offsetHeight);
document.getElementById(a).style.height=maxH+'px';
document.getElementById(b).style.height=maxH+'px';
document.getElementById(c).style.height=maxH+'px';
document.getElementById(d).style.height=maxH+'px';
}
function setH() {
setHmax('c00','c01','c02','c03');
setHmax('c04','c05','c06','c07');
setHmax('c08','c09','c10','c11');
}
window.onload=setH;

</script>

<style type="text/css">
.sites {
float: left;
width: 200px;
border: 1px solid green;
margin: 5px 5px;
padding: 5px 5px;
}
.siteH {
background-color:#CCCCCC;
width:195px;
}
a:link {
color: black;
text-decoration: none; }
a:visited {
color: black;
text-decoration: none; }
a:hover, a:active {
color: black;
background: lime;
text-decoration: underline;
}
</style>
</head>

<body>
<a name="top"></a>

<div id="TMnav">
<span><a href="index.html">Home</a></span>
<span><a href="" target="_blank">Search</a></span>
<span><a href="./sitemap.html">Site Index</a></span>

<div class="sites" id="c00">
<div>
<div class="siteH"><a href="#">Staff</a></div> <p />

<div><a href="./staff/staff_info.html">Staff Information</a></div>
<div><a href="./staff/staff_awards/staff_awards.html">Staff Awards</a></div>
<div><a href="./staff/staff_presentations.html">Staff Presentations</a></div>
<div><a href="./staff/staff_archives/staff_committee2003.html">Staff Archive</a></div>
</div>
</div>

<div class="sites" id="c01">
<div>
<div class="siteH"><a href="#">Faculty</a></div> <p />

<div><a href="./faculty/faculty.html">Introduction</a></div>
<div><a href="./faculty/facultyfulltime.html">Full-time Faculty</a></div>
<div><a href="./faculty/facultyparttime.html">Part-time Faculty</a></div>
<div><a href="./faculty/facultyclinout.html">Affiliated Faculty</a></div>
<div><a href="./faculty/facultyresident.html">Resident Faculty</a></div> <p />

<div><a href="#">Faculty News</a>
<div><a href="./faculty/faculty_news/faculty_news.html">Links to News Pages</a></div>
<div><a href="./faculty/faculty_news/faculty_news_grants.html">Faculty Grants</a></div>
</div>
<p />

<div><a href="./faculty/faculty_docs/facdocs.html">Docs for Faculty</a></div>
</div>
</div>

<div class="sites" id="c02">
<div>
<div class="siteH"><a href="./research/research_links.html">Research</a></div>
</div> <p />

<div><a href="./crc/ucb-crc/ucbcrc.html" target="_blank">Clinical Research Ctr</a></div>
</div>

<div class="sites" id="c03">
<div>
<div class="siteH"><a href="#">Eye Care Clinic</a></div> <p />
<div><a href="./eyeclinic/eyecareclinic.html">Introduction</a></div>
<div><a href="./opt/cmanual/" target="_blank">Clinic Manual (Students)</a></div>
</div>
</div>

<div style="clear:both"></div>

<div class="sites" id="c04">
<div>
<div class="siteH"><a href="#">News / Information</a></div> <p />

<div><a href="#" target="_blank">Private Practice Institute</a></div>
<div><a href="#">Placement Listings</a></div>
<div><a href="#">Placement Submissions</a></div>
<div><a href="#">FL Fill-In Listings</a></div>
<div><a href="#">FL Fill-In Submissions</a></div>
<div><a href="#">Positions/Practices</a>
<div><a href="./positions_practices/positionsPrac.html">Practice Positions</a></div>
<div><a href="./positions_practices/positions.html">Positions</a>
<div><a href="./positions_practices/positions_guide.html">Guidelines</a></div>
<div><a href="./positions_practices/positions_list.html">Listings</a></div>
</div>
</div> <p />

<div><a href="./news_info/newsspotlight.html">News Spotlight</a></div>
<div><a href="./news_info/focus-home.html" target="_blank">Magazine</a></div>
<div><a href="./news_info/news_videos.html">Video Clips</a></div>
<div><a href="./news_info/news_archives.html">Archived News</a></div>
</div>
</div>

<div class="sites" id="c05">
<div>
<div class="siteH"><a href="#">Contacts</a></div> <p />

<div><a href="./contacts/program_contacts.html">Program Contacts</a></div>
<div><a href="./contacts/admin_contacts.html">Admin Contacts</a></div>
<div><a href="./contacts/admin_units.html">Admin Units</a></div>
<div><a href="./contacts/admin_busres.html">Business/Research Serv</a></div>
</div>
</div>

<div class="sites" id="c06">
<div>
<div class="siteH"><a href="#">Services</a></div> <p />

<div><a href="./services/services_machineshop.html">Equipment Maintenance</a></div>
</div>
</div>

<div class="sites" id="c07">
<div>
<div class="siteH"><a href="#">S. Florida Area</a></div> <p />

<div><a href="./library/library.html">Library</a></div> <p />

<div><a href="#">South FL Area</a>
<div><a href="./ucb_sfbay/ucbsfbay.html">Introduction</a></div>
<div><a href="./ucb_sfbay/ucb_campus/campuslinks.html">Campus Links</a></div>
</div>
</div>
</div>

<div style="clear:both"></div>

<div class="sites" id="c08">
<div>
<div class="siteH"><a href="#">Continuing Education</a></div> <p />

<div><a href="./ce/ce_intro.html">CE Program Listing </a></div>
<div><a href="./ce/ce_residentforum.html">Resident Forum</a></div>
<div><a href="./ce/ce_stateboardreq.html">State Board Reqs</a></div>
</div>
</div>

<div class="sites" id="c09">
<div>
<div class="siteH"><a href="#">Alumni Assoc.</a></div> <p />

<div><a href="./alumni/alumni.html">Introduction</a></div>
<div><a href="./alumni/alumni_memberform.html" target="_blank">Membership Form</a></div>
<div><a href="./alumni/alumni_newsupdates.html">News Updates</a></div>
<div><a href="#">Reunion/Educ Program</a>
<div><a href="./alumni/alumni_reunion.html">Information</a></div>
</div>
<div><a href="./alumni/alumni_materials.html">Materials</a></div>
<div><a href="./alumni/alumni_board.html">Board Members</a></div>
</div>
</div>

<div class="sites" id="c10">
<div>
<div class="siteH"><a href="#">Gifts / Development</a></div> <p />

<div><a href="./gifts_develop/profaff_intro.html">Introduction</a></div>
<div><a href="./gifts_develop/profaff_giving.html">Opportunities for Giving</a></div>
<div><a href="./gifts_develop/profaff_events.html">Sponsored Events</a></div>
<div><a href="./gifts_develop/profaff_wheeler.html">Society</a></div>
</div>
</div>

<div class="sites" id="c11">
<div>
<div class="siteH"><a href="#">Schedules / Events</a></div> <p />

<div><a href="./calendars-scheds/calendars.html">Calendar</a></div>
<div><a href="./calendars-scheds/classes_schedule.html">Classes / Finals</a></div>
<div><a href="./calendars-scheds/room_calendars.html">Room Scheduling</a></div>
<div><a href="./ce/oxyopias.html">Seminars</a></div>
</div>
</div>

</div>
</body>
</html>
[/code]
×

Success!

Help @JMRKER spread the word by sharing this article on Twitter...

Tweet This
Sign in
Forgot password?
Sign in with TwitchSign in with GithubCreate Account
about: ({
version: 0.1.9 — BETA 4.29,
whats_new: community page,
up_next: more Davinci•003 tasks,
coming_soon: events calendar,
social: @webDeveloperHQ
});

legal: ({
terms: of use,
privacy: policy
});
changelog: (
version: 0.1.9,
notes: added community page

version: 0.1.8,
notes: added Davinci•003

version: 0.1.7,
notes: upvote answers to bounties

version: 0.1.6,
notes: article editor refresh
)...
recent_tips: (
tipper: @Yussuf4331,
tipped: article
amount: 1000 SATS,

tipper: @darkwebsites540,
tipped: article
amount: 10 SATS,

tipper: @Samric24,
tipped: article
amount: 1000 SATS,
)...