Div is too small and text overcome

I’m working on my ASP.NET project (written in C#).

I can’t code div to have the correct size for the text inside him. I want to have a div to capture the text well and resize itself when I shrink the page.

Can somebody help me, please?

Here is a photo with what happens.

Css code:

.box {
    width: 500px;
    height: 500px;
    border: 1px solid #e0e4e8;
    padding: 20px;
    border-radius: 10px;
    height: 100px;
    color: #717171;
    float: left;
    position: relative;
    display: block;
}

Html code:

<div class="box">
  <p class="date">Datele contului</p>
  <br />
  <table class="profil">
    <tr>
      <td>Nume:</td>
      <td>
        <asp:Label ID="lblNume" runat="server" Text=""></asp:Label>
      </td>
    </tr>
    <tr>
      <td>Prenume:</td>
      <td>
        <asp:Label ID="lblPrenume" runat="server" Text=""></asp:Label>
      </td>
    </tr>
    <tr>
      <td>Email:</td>
      <td>
        <asp:Label ID="lblEmail" runat="server" Text=""></asp:Label>
      </td>
    </tr>
  </table>
  <hr />
</div>

Answers:

Thank you for visiting the Q&A section on Magenaut. Please note that all the answers may not help you solve the issue immediately. So please treat them as advisements. If you found the post helpful (or not), leave a comment & I’ll get back to you as soon as possible.

Method 1

Just remove the height attribute in css. (or)
Try Setting height to auto.

You have set height twice in your css. Remove Both.


All methods was sourced from stackoverflow.com or stackexchange.com, is licensed under cc by-sa 2.5, cc by-sa 3.0 and cc by-sa 4.0

0 0 votes
Article Rating
Subscribe
Notify of
guest

0 Comments
Inline Feedbacks
View all comments
0
Would love your thoughts, please comment.x
()
x