Question

I have got a problem with a mark up.

It happening when I resize browser window.

Here is my code (ASP.NET):

<asp:Panel ID="PanelGrid" runat="server" CssClass="frame">
 <fieldset class="fs">                        
   <legend> 
     <asp:Label ID="Label" runat="server" Text="LALALA"></asp:Label>
   </legend>
  </fieldset>
</asp:Panel>

The result looks like this:

The border was outside of the Panel.

If I use this code(without <fieldset>):

<asp:Panel ID="PanelGrid" runat="server" CssClass="frame">

   <legend> 
     <asp:Label ID="Label" runat="server" Text="LALALA"></asp:Label>
   </legend>

</asp:Panel>

The result looks like this:

How can I must write the CSS class (“fs”), if I want to use <fieldset>?
Thanks!

P.S My class code:

.frame
{


    margin: 1px;
    padding: 3px;
    border: 1px solid Navy;

    background-color: White;
    font-size: 9pt;

    box-shadow: 0 0 5px 1px #1A3457; /* Валидное свойство CSS 3 тень*/
    -webkit-box-shadow: 0 0 5px 1px #1A3457; /* Safari, Chrome */
    -moz-box-shadow: 0 0 5px 1px #1A3457; /* Firefox */
    border-radius: 5px;
}

Answer 1

Try this css:

.fs {
    width: 100%;
    overflow: scroll;
}