JQuery Gleiche Höhe DIVs - Javascript, Jquery, HTML

Ich bin neu in diesem Bereich und ich denke, ich vermisse etwas einfaches.

Du kannst es sehen Hier.

Wie Sie in den Meldungsfeldern sehen können, funktioniert das JavaScript einwandfrei, aber die Größe der beiden DIVs wird nicht auf dieselbe Höhe geändert.

Das von mir verwendete JavaScript lautet:

function doResize() {
alert("before: being " + $("#being").height());
alert("before: questions " + $("#questions").height());
maxHeight = 0;
var divs = jQuery("#questions, #being");
$.each(divs, function () {
var height = jQuery(this).height();
if (maxHeight < height) maxHeight = height;
});
divs.height(maxHeight);
alert("after: being " + $("#being").height());
alert("after: questions " + $("#questions").height());
$("#main").css("visibility", "visible");
}

Ich rufe diese Funktion beim Dokument-Onload-Ereignis auf.

Bitte leite mich, weil dieser Code auf anderen Seiten funktioniert!

freundliche Grüße!

EDIT (hier ist der korrigierte Code):

function doResize()
{

//alert("before: being " + $("#beingContent").height());

//alert("before: questions " + $("#questionsContent").height());

maxHeight = 0;

var divs = jQuery("#questionsContent, #beingContent");

$.each(divs, function(){
var height = jQuery(this).height();
if(maxHeight<height)
maxHeight = height;
});

divs.height(maxHeight);

$("#beingContent").css("height", maxHeight - 2);

//alert("after: being " + $("#beingContent").height());

//alert("after: questions " + $("#questionsContent").height());


$("#root").css("visibility", "visible");

}

und das CSS:

#beingContent { padding:0 5px !important; border:1px solid black !important ;}

Das Problem mit der Ausrichtung wurde gelöst! Vielen Dank.

Antworten:

0 für die Antwort № 1

CSS

#being {
padding:0 5px !important;
}

---

div mit being hat padding :5px so oben und unten bekommt 5px extra jeder, der so ein anderes schafft als padding :5px Weisen Sie einfach die Auffüllung links und rechts zu.

---

1 für die Antwort № 2

Ränder / Polsterung von css entfernen; oder verwenden Dies für den Sieg. :)

Weil ich auch faul bin, füge dies einfach zu deinem Stylesheet hinzu:

/* apply a natural box layout model to all elements */
*, *:before, *:after {
-moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box;
}

---