Bug Tracker

#14165 closed bug (notabug)

Opened July 22, 2013 10:02PM UTC

Closed July 22, 2013 10:10PM UTC

Last modified July 23, 2013 12:31AM UTC

width change of html element during append, using Django template

Reported by: anonymous Owned by:
Priority: undecided Milestone: None
Component: unfiled Version: 1.10.2
Keywords: Cc:
Blocked by: Blocking:
Description

Below is the HTML code.

If you try to load it into the browser directly, both alerts (before placement onto "body" and after) will give you width=498px as expected.

However, if you set it up as Django template and run with Django development server, the second alert (after placement onto "body") will give you a slightly different number depending on the browser: Firefox gives 497.76666px, IE gives 498.1px. I have not checked other browsers.

It is important to note, that it is that combination of css attributes ("left", "top", "width", "height", "border-width", "background-color", "border-style") that shows the problem. If you remove at least one of them, the problem goes away.

If you happen know what is going on and/or what the viable workaround is, I would really appreciate it. Thanks. Here is the code:

<!doctype html>

<html lang="en">

<head>

<script src="http://code.jquery.com/jquery-1.9.1.js"></script>

<script>

$(function() {

var my_element = $("<div/>")

.addClass("my_element")

.attr("id", "my_element1")

.css("position", "absolute")

.css("left", "0px")

.css("top", "0px")

.css("width", "498px")

.css("height", "300px")

.css("border-width", "1px")

.css("background-color", "#999966")

.css("border-style", "solid");

alert("width:" + my_element.css("width"));

$("body").append(my_element);

alert("width:" + my_element.css("width"));

});

</script>

</head>

<body>

</body>

</html>

Attachments (0)
Change History (2)

Changed July 22, 2013 10:10PM UTC by dmethvin comment:1

resolution: → notabug
status: new → closed

The bug tracker isn't set up for programming help, and we're not experts in Django templates. Ask for help on a forum please. And always use the most recent version of jQuery (1.10.2) to ensure the issue isn't some already-fixed bug.

Changed July 23, 2013 12:31AM UTC by anonymous comment:2

Replying to [comment:1 dmethvin]:

The bug tracker isn't set up for programming help, and we're not experts in Django templates. Ask for help on a forum please. And always use the most recent version of jQuery (1.10.2) to ensure the issue isn't some already-fixed bug.

Hi, thanks for the prompt response. The problem manifests itself right after JQuery "append" method is invoked, I provided a simple code that proves that. I will ask Django people, but are you 100% sure the bug is not in JQuery? If it is, then what am I supposed to do? May be it would be worthwhile to test it at least on your side, since the code is very simple.