Question 87363 in ASP.NET Question posted in
The official documentation can be found here.

A "title" or a "header" for a div – Asp.net

I am building a simple web-page with a few sections in it and I’ve been stomped at how to solve one little styling issue.

I have several DIVs with solid border and a few other GUI items (text boxes, buttons, etc) inside each one. Each DIV kind of "boxes" related items into a nice, visually pleasing and meaningful way. However, I would like to add a title or a caption onto the DIV in the middle of the border to describe that box’s function. So far I can add text below the border or above, but not in the middle. Is that even possible?

Thank you!

What I have:
what I have

What I want:
enter image description here

Tags:

2

Answers


  1. 0

    What you want looks like a fieldset element with a legend tag inside, but I wouldn’t recommend using them.
    Just use position: absolute like this:

    <div class='section'>
    <header>Header</header>
    ....
</div>

    .section{
    position: relative;
}

.section header{
    position: absolute;
    top: 0;
    transform: translate(0, -50%);
    background: white;
}
    Login or Signup to reply.
  2. 0

    What you looking for is build in HTML nativly: The border Frame is part of the <fieldset> while the title is the <legend>

    <fieldset>
  <legend>Header</legend>
</fieldset>
    Login or Signup to reply.
Please signup or login to give your own answer.

Back To Top
Search