height

make canvas height auto

由 坚强是说给别人听的谎言 提交于 2019-12-02 14:59:47
问题 I have the canvas <canvas id="canvas" width="1700" height="679" style="background-color:#ffffff;width:100%;overflow:hidden;margin-top: -7px;"></canvas> It work fine on chrome and firefox. However, ie can work only with width:100% but not change the height (height on 679) I try height to be auto and 100% but getting wose Edit: finally! I got it. It's true that the canvas content will be not good at width 100%. However, for the height (IE9 above is work) you have to set height style $("#canvas"

How to properly set the 100% DIV height to match document/window height?

由 ≯℡__Kan透↙ 提交于 2019-12-02 14:31:54
I have a wrapper positioned to center with an y-repeated background image: <body> <div id="wrapper"> ...some content </div> </body> #wrapper{ width: 900px; margin: 0 auto 0 auto; background-image: url(image.jpg) 250px 0px repeat-y; } Problem: when the window size is higher than the wrapper's height inherited from its content, the image obviously doesn't repeat on y-axis all the way to the bottom of the window. I've used jQuery to dynamically apply inline CSS style to the wrapper according to actual document height (when DOM is ready and on window resize event): $(function(){ $('#wrapper').css(

JavaScript - function to get real image width & height (cross browser)

由 旧街凉风 提交于 2019-12-02 13:39:22
How to get real image width & height (cross browser) by JavaScript function ? First of all, you have a greater chance of getting your question answered if you'd just ask it in a more polite way, and supplying as much relevant information as possible. Anyway... For as far as I know, you can use the .width property across pretty much all browsers: function getDimensions(id) { var element = document.getElementById(id); if (element && element.tagName.toLowerCase() == 'img') { return { width: element.width, height: element.height }; } } <img id="myimage" src="foo.jpg" alt="" /> // using the

Firefox ignoring min-height in CSS

由 蓝咒 提交于 2019-12-02 13:02:55
For some reason, min-height is not working on Firefox. I tried setting min-height on the body, but Firefox totally ignored it. Since my page is dynamic, I cannot just set the height to 100%. What should I do? body { border: 1px solid black; width: 100%; min-height: 100%; } <body> This is the body. </body> height percentages are inherited (that includes min-height and max-height , too). From the CSS spec: Specifies a percentage for determining the used value. The percentage is calculated with respect to the height of the generated box's containing block . What most people don't realize is that

Android WebView: how to let the css use the entire height w/ position absolute?

由 一笑奈何 提交于 2019-12-02 11:16:17
问题 I have a very responsive html/css page that uses position:absolute to put elements in place. e.g. a username input will have position:absolute; top:30%; height:8%; left:35%; right:65%; Everything works well in all browsers but webView android has a problem with the height. It seems that it adapts itself to the height of the content instead of "being" of a certain height like any browser, and let the css deal with that arbitrary height. I don't see any issue with the width but that might be an

Fluid height main body with header and footer

由 我与影子孤独终老i 提交于 2019-12-02 10:52:41
What I am trying to do is have the header at the top of the page and the footer at the bottom, with the map full up all availiable space in-between. I also want the header and footer to have fixed heights as px not %. However, at the moment because I set the main map to 100% it forces the footer off the bottom of the page and introduces a scroll bar. This is my example code: http://jsfiddle.net/W4mXP/20/ CSS html, body { height: 100%; width: 100%; } #topbar { height: 50px; width: 100%; background-color: black; padding-left: 50px; padding-right: 50px; } #main { height: 100%; width: 100%;

Sticky Footer CSS Problems

由 ╄→гoц情女王★ 提交于 2019-12-02 09:47:25
I have been able to design my layout so that it has 2 columns and a width of 100%, you can see that here . Now I'm trying to implement a sticky footer (100%) height with this layout which also has the background in the right hand column flow down the footer and also with the border I have in the left hand column. Is there a way to do this with my current layout or it would great if anyone could suggest an alternative to the way I'm currently doing it! Thanks! ChssPly76 Take a look at Sticky Footer 2009 . This has been discussed multiple times on SO as well. I would add a CSS class to the DIV

How do I find the width/height of ImageView?

由 ℡╲_俬逩灬. 提交于 2019-12-02 08:11:28
My question is similar to this question . I've used this code to extend ImageView to form TouchImageView. In my onCreate() method, I want to call setImage(Bitmap bm, int displayWidth, int displayHeight) but I don't know the width or height to use. When I call getHeight(), it gives me zero. I tried to avoid the 0 using kcoppock 's answer to the previously mentioned question , but was unsuccessful. The onPreDraw() listener is called several times per second and I can't figure out how to only call it once. That's a brittle approach for something like this. Android Views are measured by their

make canvas height auto

由 无人久伴 提交于 2019-12-02 04:57:50
I have the canvas <canvas id="canvas" width="1700" height="679" style="background-color:#ffffff;width:100%;overflow:hidden;margin-top: -7px;"></canvas> It work fine on chrome and firefox. However, ie can work only with width:100% but not change the height (height on 679) I try height to be auto and 100% but getting wose Edit: finally! I got it. It's true that the canvas content will be not good at width 100%. However, for the height (IE9 above is work) you have to set height style $("#canvas").attr('style','background-color:#ffffff; width:100%;height:679px;overflow:hidden;margin-top: -7px;');

How to dynamically scale images per height using pure CSS?

由 大兔子大兔子 提交于 2019-12-02 04:30:04
This one goes out to the CSS pros: I wonder if it's possible to achieve a image scaling behavior like on this site using pure CSS? Be aware that the images only start scaling if the height of the browser window changes, not its width. (Just saying because all info on the web I found is about the alteration of the width.) The real sticking point seems to be the different threshold values: Landscape-shaped images just start scaling down if they have the same height as the already downscaled portrait-shaped images. Any feedback on that matter is highly appreciated! You can do it with a
订阅 height