I am developing responsive web application in the asp.net mvc.
I want to set some product boxes based on the Current browser/screen resolution, but i am getting issue in getting the correct width of browser resolution.
If I write Request.Browser.ScreenPixelsWidth it gives me all time 640*480.
But its wrong. And if I write the var screen = System.Windows.Forms.Screen.PrimaryScreen.Bounds;
var width = screen.Width;
Its giving me correct windows resolution which i have set from my window property. Its giving me 1600*900 which is correct value. But issue here is if i manually make my browser screen small and run again that code at that it also gives me 1600*900, but it should give me the size of what i have done manually small.
Any idea?
Handling browser size on the server, you won't know if the user resizes the browser between requests. The correct way to handle browser size is on the client with CSS media queries. Media queries allow you to dynamically set different styles for different browser sizes, i.e. a more responsive layout. Here's a decent intro:
http://kyleschaeffer.com/development/responsive-layouts-using-css-media-queries/
Related
I am working on a Web application that uses the Windows Forms C# Webbrowser to take screenshots of Web pages and save them for archiving purposes.
I am running into an issue with pages that use max-device-width in CSS media queries for responsive layout.
Apparently the max-device-width for the Webbrowser control defaults to 1024 px which causes certain CSS rules to fire resulting in layout issues.
Using max-width in the media queries would probably fix this, but would have the undesired effects when resizing the browser window on desktop browsers.
Is there some way of specifying the max-device-width of the Webbrowser?
I want to submit my app on windows store but due to one error I can't.
Error:
Content compliance: failed
The app failed to resume properly from snapped view.
How to sort out this error? I have check here but not able to get proper solution.
It doesn't look like your app fluidly adapts to the snapped view. Perhaps that is why it failed.
If you keep the default minimum width of 500 pixels, you do not have
to make any special considerations for your app at narrow widths. You
simply design your app so that it adapts fluidly when the user resizes
the app
One should keep provisions for snap view in UI.
Its in UX Guideline of store app.
if its not supported then appropriate view should generated for the same
This Link will helpfull to you
I am trying to retrieve width of my browser in pixels but for some reason I am getting back 640, my resolution is at 1240.
Code I am using is Request.Browser.ScreenPixelsWidth
Does anyone knows why it returns 640 always or if there is another way for me to get the width of the browser upon page load?
You need to populate a hidden field with Javascript (see this question for how to do that), and then send that field back to the server so that it's avaialble within ASP.NET.
ASP.NET is incapable of reading detailed browser information like that directly (you're talking about sending some very specific information from the client's browser to the ASP.NET server where your application is hosted, and there are a lot of problems involved with doing something like that).
See this similar, but less detailed, question:
Asp.Net Get Screen Width
try this
int x = (Request.Browser.ScreenPixelsWidth)*2-100;
you can set width according to your requirement
I have a web application on VS2005 using C#.
Whenever my webpage does not open up in full screen, the icons and labels will automatically adjust to fit the width of the windows, making the buttons and icons disoriented.
Is there any way to disable this or enable the format to be fixed regardless if the windows is full screen or not?
This would be hard to do. You could use a function in javascript to chceck if browser is in full screen. Then you woud have to do this in intervals to make sure that this is or is not true.
if (screen.width == window.innerWidth && screen.height == window.innerHeight) {
// web browser full screen
}
Based on that you could make another screen CSS template that you could apply based on that condition. Then you could make your site apply another layout.
Another approach I would reccoment is to make your CSS layout in a way that you would be satisfied with it with any browser size.
You can use CSS to set width (which will be fixed) or min-width (layout will not shrink to less). min-width is not supported on older versions of IE.
In both cases if the browser window is smaller (or the available space – if something like history is opened down the side) than this then horizontal scrolling will be alloed.
However consider that many users have very wide screens these days, far too wide for comfortable reading if a browser is maximised.
I can not figure out why my web form buttons change size when I run the web form from Windows 7 vs. Windows Server 2003. I have set the positioning and size on page load for all objects. Here is an example of a couple of the objects I am using.
Label1.Style.Add("Position", "fixed");
Label1.Style.Add("TOP", "20px");
Label1.Style.Add("Left", "50px");
btnQuery.Style.Add("Position", "fixed");
btnQuery.Style.Add("TOP", "370px");
btnQuery.Style.Add("Left", "198px");
The buttons have the same 3 entries. When I run this from my local Windows 7 PC, everything looks great. However, when I publish this to my Server 2003 site, the buttons are about 5 times longer and cover each other up. My label, textbox, and listbox are all fine as well. It is just the buttons. Is it because I am developing on Windows 7? Also, I am doing this in Visual Studio 2010, Framework 4.
They are changing because you are giving the size in pixels. If users have different screen resolutions, then it will change how large the buttons are in relation to the screen. Use relative sizing to fix this. This is not OS dependent, may just seem like it.
You're only setting the top/left position of the button, but not the size... If not specified, then web browsers are free to make buttons look however they want.
Assuming that this Style.Add method actually translates to CSS, try adding:
btnQuery.Style.Add("height", "120px");
btnQuery.Style.Add("width", "300px");
Then tweak those so its the size you want.
Generally, I'd advise against using fixed positioning at all, but that is a different story.