/    Sign up×
Community /Pin to ProfileBookmark

Hey!

I’m sure there is an easy solution, but I am missing it at the moment. Basicly I want to have three or four different divs that put their top location based on the bottom of the last div. So if someone resized the window and made it less wide then the top div would become taller and so the div below would need to move down some. I tried

[code]
<script>
function Resize()
{
var TextDiv = document.getElementById(“text”);
var LinkDiv = document.getElementById(“stringlink”);
LinkDiv.style.top = TextDiv.style.bottom;
// I also tried
LinkDiv.sytle.top = TextDiv.style.top + TextDiv.style.height;
}
window.onload = Resize();
window.onresize = Resize();
</script>
[/code]

The only time it works is if I specifically give bottom or height a number value and not a % value, but I want all the divs to have % values so that they can adjust based on the size of the screen the user is using and not based on the size of the screen I tested it on.

Any tips?
Thanks again for your time.

to post a comment
JavaScript

4 Comments(s)

Copy linkTweet thisAlerts:
@007JulienDec 18.2012 — Use only CSS with a div without width (or 100%) and the three following with a class

.fltlft {display:block;width:33%;float:left;}
Copy linkTweet thisAlerts:
@LesshardtoofindauthorDec 18.2012 — so in other words there is no way to circumvent the problem?
Copy linkTweet thisAlerts:
@LesshardtoofindauthorDec 19.2012 — I found the problem.
<i>
</i>var x = Text.style.top;

returns a string with px appended to it. So to do arithmatic with two such variables you would end up with an appended string looking like

10px100px

Trying to give that to a style value obviously breaks the code. I still haven't found out how to get the value of the height if it is based on a % width and the window resizes.
Copy linkTweet thisAlerts:
@007JulienDec 19.2012 — Use offsetTop or offsetLeft (see for example this page) which are read only and give numbers.
×

Success!

Help @Lesshardtoofind 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 5.19,
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: @AriseFacilitySolutions09,
tipped: article
amount: 1000 SATS,

tipper: @Yussuf4331,
tipped: article
amount: 1000 SATS,

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