Member Avatar for jaihoon.meerzakhel

hello,

i want to aske that how to make our controls in asp.net responsive i always have probleme with the positioning of the controls in the right place for example: if i want to put my controls in the center i should use margins and paddings
but the probleme with this is if you small the browser from its actuall it will still have its margins and it looks very bad if its maximised no probleme it looks perfect please help me i want in both stuition the controls inside the webform should be resposive either in maximized mode or either if the browser is small

  • 3 Contributors
  • 2 Replies
  • 78 Views
  • 1 Day Discussion Span
  • Latest Post Latest Post by almostbob

Dani AI

Generated

Short answer: treat this as a front-end layout problem, not an ASP.NET bug. is right that the page your users see is HTML/CSS, and was pointing in the right direction about avoiding rigid sizing. Below are practical, WebForms-aware steps that avoid fragile pixel layouts.

Use a fluid container and a flexible layout (Flexbox or Grid), give controls predictable selectors, and let elements grow/shrink instead of positioning them with absolute offsets. Apply CSS classes to server controls with the CssClass attribute and, when you need predictable IDs for JS/CSS, set ClientIDMode="Static". A compact pattern: a centered page container with max-width plus a flex row that wraps; controls get a flexible base size and min/max widths so they reflow cleanly.

.container {
  max-width: 1100px;
  margin: 0 auto;
  padding: 0 1rem;
  box-sizing: border-box;
}

.row { display: flex; flex-wrap: wrap; justify-content: center; gap: 1rem; }

.control { flex: 1 1 220px; min-width: 160px; max-width: 320px; }

@media (max-width: 600px) { .control { flex-basis: 100%; } }

Test with browser device emulation and resize the window while watching flex breakpoints. Avoid absolute positioning for layout, include the mobile viewport meta tag, and prefer relative units for spacing. For implementation patterns and browser support, see the MDN responsive design guide (MDN Responsive Design) and the WebForms ClientIDMode docs (ClientIDMode).

Recommended Answers

All 2 Replies

Member Avatar for JorgeM

The fact that its asp.net shouldn't be the focus because all of these controls will render as HTML elements. So you simply need to use CSS to style it appropriate so it behaves responsive.

Member Avatar for almostbob

margins paddings pretty much everything except a picture, are never dimensioned in px, or any fixed size dimension, it does not work
current best practice is em rem % elements and spacings, which look very similar on all devices
if all horizontal dimensions add to 100%, the window is full, regardless how big or small the screen is, or how much of the screen the window occupies

Edited by almostbob
Be a part of the DaniWeb community

We're a friendly, industry-focused community of developers, IT pros, digital marketers, and technology enthusiasts meeting, networking, learning, and sharing knowledge.