Member Avatar for BlueCharge

Hello Everyone,

I have a quick question which is:

I have a signature DIV in my forums and i want the maxium height of this DIV to be 100px but if the user has just chosen a small signature which does not reach 100px then i just want the DIV to be the same size as the content, how would i do this?

Thanks

Daniel

  • 2 Contributors
  • 2 Replies
  • 94 Views
  • 6 Hours Discussion Span
  • Latest Post Latest Post by almostbob

Dani AI

Generated

Good call — the CSS rule you found will cap the signature box. To answer : what happens when a signature is taller depends on how you handle overflow. You can let excess show, clip it, or make the box scrollable. Each choice has trade-offs for layout, appearance, and accessibility.

Practical steps most forums use: keep the height cap you already applied, but also set the container to include padding in the box model and to allow scrolling when needed. That prevents unexpected layout shifts and gives users a way to reach long signatures without breaking the page.

.signature {
  box-sizing: border-box;
  overflow-y: auto;
  padding: 8px;
  /* keep the height cap you already set */
}

Constrain images inside signatures so they do not force the box taller or wider:

.signature img {
  max-width: 100%;
  height: auto;
  display: block;
}

If you prefer not to show scrollbars, provide a progressive enhancement: a small "Show more" control that toggles a class to reveal the full signature and updates an ARIA attribute so it remains keyboard- and screen-reader friendly. Minimal JS to toggle a class and aria state:

document.querySelectorAll('.sig-toggle').forEach(btn => {
  btn.addEventListener('click', () => {
    const target = document.getElementById(btn.dataset.target);
    const expanded = target.classList.toggle('expanded');
    btn.setAttribute('aria-expanded', expanded);
  });
});

See the CSS references for details on overflow behavior and box sizing: overflow, box-sizing. For accessible show/hide patterns consult the ARIA disclosure guidance: WAI-ARIA practices.

Member Avatar for BlueCharge

lol never mind it's max-height: 100px

Wow im such a fag...

Member Avatar for almostbob

what if they chose a signature that is more than 100px, do you clip

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.