{var%20f='http://v.t.sina.com.cn/share/share.php?appkey=1515056452',u=z||d.location,p=['&url=',e(u),'&title=',e(t||d.title),'&source=',e(r),'&sourceUrl=',e(l),'&content=',c||'gb2312','&pic=',e(p||'')].join('');function%20a(){if(!window.open([f,p].join(''),'mb',['toolbar=0,status=0,resizable=1,width=440,height=430,left=',(s.width-440)/2,',top=',(s.height-430)/2].join('')))u.href=[f,p].join('');};if(/Firefox/.test(navigator.userAgent))setTimeout(a,0);else%20a();})(screen,document,encodeURIComponent,'','','https://www.manongdao.com/data/attach/logo/logo.png', '推荐 smile是对你的礼貌 的问题《Resize of div is being ignored》','https://www.manongdao.com/q-986605.html','页面编码gb2312|utf-8默认gb2312'));){kind=link}
I have a super-simple web page that loads data from a server into s as containers. The problem is that sometimes images are too tall, and overflow and cause layout problems. So, I was looking to resize the divs using:
target.style.height = height; // As short form of:
document.getElementById('someId').style.height=height;
But so far NOTHING I've tried has worked. Here's the html file:
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
</head>
<body bgcolor="#E3FBFF" text="#000000" onload="loadImages();">
<script type = "text/javascript">
function loadImages()
{
...Function omitted for brevity...
But it gets to this line:
document.getElementById(d0).style.height = height+10;
}
</script>
<div id=d0></div>
<hr>
<div id=d1></div>
<hr>
<div id=d2></div>
<hr>
<div id=d3></div>
<hr>
</body>
</html>
That's it!
I have found various articles like this one, or this one, but, they weren't helpful.
It occurs to me to mention that in my case I don't require the use of divs per se. I just need the images and related text to not overlap vertically (or horizontally). As it is, when the images load, it can be a real mess. ...How can I tell my divs to be full width with no overlay from the other divs? I tried using a class, using CSS, and more, all ignored.
I guess I was working under the improper assumption that divs, as block-oriented things, that even if you declare full width ("width=100%") can and will STILL overlap vertically depending on the contents placed in them.
Add a unit to your
heightvariable. As you are editing the CSS style of the element this is required. See: MDNdocument.getElementById('someId').style.height=heightbecomes:document.getElementById('someId').style.height = height.toString() + 'px'you didnt show what you assigned to 'height', but from your code i assume its an interger.
style takes a string (ie 10px), so assigning number to it won't work, try the following
javascript will convert it to string for you
more on integer to string here What's the best way to convert a number to a string in JavaScript?