• Status: Solved
  • Priority: Medium
  • Security: Public
  • Views: 555
  • Last Modified:

html style attibutes not working in master page

These attibutes are what give these tabs a follder effect. Looks fine in the design view but attributes are not there when ran. When ran, the tabs look and work correctly but no style attributes applied. I initally was doing this with CSS but decided to get working in it's most basic form first. Can you guys help me get this working?

<td style="width: 600px;background-color: White;
            font-size: x-small;
            border-left: 1px solid black;
            border-bottom: 1px solid black;
            border-right: 1px solid black;
            border-top:1px solid black;
            position:absolute;
            top:42px;
            height:400px;
            z-index:-25;">

Complete code in code snippet
<%@ Page Language="VB" MasterPageFile="~/Users/MasterPage.master" AutoEventWireup="false" CodeFile="Default.aspx.vb" Inherits="_Default"  title="PHL: Bullitin"%>
<%@ MasterType VirtualPath="~/Users/MasterPage.master"  %>
<asp:Content ID="Content1" ContentPlaceHolderID="head" Runat="Server">
</asp:Content>
<asp:Content ID="Content2" ContentPlaceHolderID="ContentPlaceHolder1" Runat="Server">
        <asp:Menu
            ID="Menu1"
            Width="168px"
            runat="server"
            Orientation="Horizontal"
            StaticEnableDefaultPopOutImage="False"
            OnMenuItemClick="Menu1_MenuItemClick">
            <Items>
                <asp:MenuItem ImageUrl="~/images/selectedtaborigFR.jpg" Text=" " Value="0"
                ToolTip="Filtered Results"></asp:MenuItem>
            <asp:MenuItem ImageUrl="~/images/unselectedtabFCNU.jpg" Text=" " Value="1"
                ToolTip="Enter Search Criteria"></asp:MenuItem>
         </Items>
        </asp:Menu>
        
        <asp:MultiView 
            ID="MultiView1"
            runat="server"
            ActiveViewIndex="0">
           <asp:View ID="Tab1" runat="server"  >
                <table width="600" height="400" cellpadding=0 cellspacing=0>
                    <tr valign="top">
                        <td style="width: 600px;background-color: White;
            font-size: x-small;
            border-left: 1px solid black;
            border-bottom: 1px solid black;
            border-right: 1px solid black;
            border-top:1px solid black;
            position:absolute;
            top:42px;
            height:400px;
            z-index:-25;">
                            <br />
                            <br />
                            TAB VIEW 1
                            INSERT YOUR CONENT IN HERE
                            CHANGE SELECTED IMAGE URL AS NECESSARY
                        </td>
                    </tr>
                </table>
             </asp:View>
            <asp:View ID="Tab2" runat="server">
                <table width="600px" height="400px" cellpadding=0 cellspacing=0>
                    <tr valign="top">
                        <td style="width: 600px; background-color: White;
            font-size: x-small;
            border-left: 1px solid black;
            border-bottom: 1px solid black;
            border-right: 1px solid black;
            border-top:1px solid black;
            position:absolute;
            top:42px;
            height:400px;
            z-index:-25;">
                        <br />
                        <br />
                            TAB VIEW 2
                            INSERT YOUR CONENT IN HERE
                            CHANGE SELECTED IMAGE URL AS NECESSARY
                        </td>
                    </tr>
                </table>
            </asp:View>
        </asp:MultiView>         
</asp:Content>

Open in new window

0
techpr0
Asked:
techpr0
1 Solution
 
sunithnairCommented:
Can you please paste the html source from browser view source?
0
 
viral_sonawalaCommented:
Instead of this create new css file and apply that style to class or id anc then include that css file in this page and calls that id or class in that td which you want.

It will work for sure....
0
 
CtrlAltDlCommented:
I copied your code and it worked for me.
0
Concerto Cloud for Software Providers & ISVs

Can Concerto Cloud Services help you focus on evolving your application offerings, while delivering the best cloud experience to your customers? From DevOps to revenue models and customer support, the answer is yes!

Learn how Concerto can help you.

 
prairiedogCommented:
Do you have a screen shot of what it should look like and what it looks like now?
0
 
techpr0Author Commented:
view source for sunithnair:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">
<head><title>
      PHL: Bullitin
</title>

<link href="StyleSheet.css" rel="stylesheet" type="text/css" />
    <style type="text/css">
        .style1
        {
            height: 44px;
        }
        .style2
        {
            height: 100%;
            width: 10px;
        }
        .style3
        {
            height: 100%;
            width: 100%;
        }
        .style4
        {
            width: 100%;
        }
        .style8
        {
            width: 269px;
        }
        .style9
        {
            width: 611px;
        }
        .style10
        {
            width: 116px;
        }
    </style>
<style type="text/css">
      .ctl00_ContentPlaceHolder1_Menu1_0 { background-color:white;visibility:hidden;display:none;position:absolute;left:0px;top:0px; }
      .ctl00_ContentPlaceHolder1_Menu1_1 { text-decoration:none; }
      .ctl00_ContentPlaceHolder1_Menu1_2 { width:168px; }

</style></head>
<body style="text-align:center; background-color:#27282A; vertical-align:top">
    <form name="aspnetForm" method="post" action="Default.aspx" id="aspnetForm" style="vertical-align:top">
<div>
<input type="hidden" name="__EVENTTARGET" id="__EVENTTARGET" value="" />
<input type="hidden" name="__EVENTARGUMENT" id="__EVENTARGUMENT" value="" />
<input type="hidden" name="__VIEWSTATE" id="__VIEWSTATE" value="/wEPDwUKMjA1MzAxMzE0NA9kFgJmD2QWAgIDD2QWEgIdDw8WAh4HRW5hYmxlZGhkZAIfDw8WAh8AaGRkAiEPDxYCHwBoZGQCIw8PFgIfAGhkZAIlDw8WAh8AaGRkAikPZBYCAgEPPCsADQEMFCsAA2QUKwACFgIeCFNlbGVjdGVkZ2RkZAItDw8WBB4EVGV4dGUeB1Zpc2libGVoZGQCLw8PFgIfA2hkZAIxDw8WAh8DaGRkGAMFHl9fQ29udHJvbHNSZXF1aXJlUG9zdEJhY2tLZXlfXxYCBRhjdGwwMCRMb2dpblN0YXR1czEkY3RsMDEFGGN0bDAwJExvZ2luU3RhdHVzMSRjdGwwMwUkY3RsMDAkQ29udGVudFBsYWNlSG9sZGVyMSRNdWx0aVZpZXcxDw9kZmQFH2N0bDAwJENvbnRlbnRQbGFjZUhvbGRlcjEkTWVudTEPD2QFATBkKOmtlUPGrkJkBwy1HaRPr8vWl9s=" />
</div>

<script type="text/javascript">
//<![CDATA[
var theForm = document.forms['aspnetForm'];
if (!theForm) {
    theForm = document.aspnetForm;
}
function __doPostBack(eventTarget, eventArgument) {
    if (!theForm.onsubmit || (theForm.onsubmit() != false)) {
        theForm.__EVENTTARGET.value = eventTarget;
        theForm.__EVENTARGUMENT.value = eventArgument;
        theForm.submit();
    }
}
//]]>
</script>


<script src="/PHL/WebResource.axd?d=pfpQEAaCXjXkJh6WeJMDEg2&amp;t=633614924669843750" type="text/javascript"></script>


<script src="/PHL/WebResource.axd?d=A58d1doukWdsV7tdegGwBQ2&amp;t=633614924669843750" type="text/javascript"></script>
    <div style="vertical-align:top">
        <table border="1" cellpadding="0" cellspacing="0" style="width: 90%; height: 100%; background-color:#FFFFFF; border-color:#000000; vertical-align:top">
            <tr>
                <td colspan="2" valign="top" align="right" class="style1">
                    <table bgcolor="#27282A" class="style4">
                        <tr>
                            <td align="left" valign="top" rowspan="2">
                                <img id="ctl00_Image1" src="../images/phlhead.jpg" style="border-width:0px;" />
                                <br />
                            </td>
                            <td align="right" style="color: #0000FF" valign="middle">
                               
&nbsp;
&nbsp;</td>
                            <td align="right" style="color: #0000FF">
                                <a id="ctl00_LoginStatus1" href="javascript:__doPostBack('ctl00$LoginStatus1$ctl02','')">Login</a>
                            </td>
                        </tr>
                        <tr>
                            <td colspan="2">
                    <input name="ctl00$TextBox3" type="text" id="ctl00_TextBox3" style="width:150px;" />&nbsp;&nbsp;&nbsp;
                    <input type="submit" name="ctl00$btnQuickSearch" value="Search" id="ctl00_btnQuickSearch" />
                            </td>
                        </tr>
                        </table>
                </td>
            </tr>
            <tr valign="bottom">
                <td align="left" style="height: 26px" valign="bottom" bgcolor="#507cd1">
                &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
                    &nbsp;&nbsp;
                    &nbsp;&nbsp;
                    &nbsp;&nbsp;
                    &nbsp;&nbsp;
                    &nbsp;&nbsp;
                    &nbsp;&nbsp;
                                       
                </td>
                <td bgcolor="#507CD1">
                    <table align="left" width="800px">
                        <tr>
                            <td align="left">
                    <input type="submit" name="ctl00$btnMainMenu" value="Main Menu" id="ctl00_btnMainMenu" style="width:110px;" />
                    <input type="submit" name="ctl00$btnUnitMaintForm" value="Unit Maint. Form" id="ctl00_btnUnitMaintForm" style="width:110px;" />
                    <input type="submit" name="ctl00$btnEquipment" value="Equipment/Unit" id="ctl00_btnEquipment" style="width:110px;" />
                    <input type="submit" name="ctl00$btnJobs" value="Job/Location" id="ctl00_btnJobs" style="width:110px;" />
                    <input type="submit" name="ctl00$btnUnitLog" value="Unit Event Log" id="ctl00_btnUnitLog" style="width:110px;" />
                    <input type="submit" name="ctl00$btnPersonnel" value="Personnel" id="ctl00_btnPersonnel" style="width:110px;" />
                    <input type="submit" name="ctl00$btnAdmin" value="Admin" id="ctl00_btnAdmin" style="width:110px;" />
                   
                            </td>
                        </tr>
                    </table>
                </td>
            </tr>
           
            <tr>
                <td valign="top" bgcolor="#d8d8d8" class="style2">
                    <table style="height: 308px">
                        <tr>
                            <td style="width: 100px">
                                <input type="submit" name="ctl00$btnSearch" value="Search" id="ctl00_btnSearch" style="width:80px;" /></td>
                        </tr>
                        <tr>
                            <td style="width: 100px">
                                <input type="submit" name="ctl00$btnNew" value="New" id="ctl00_btnNew" disabled="disabled" style="width:80px;" /></td>
                        </tr>
                        <tr>
                            <td style="width: 100px">
                                <input type="submit" name="ctl00$btnEdit" value="Edit" id="ctl00_btnEdit" disabled="disabled" style="width:80px;" /></td>
                        </tr>
                        <tr>
                            <td style="width: 100px">
                                <input type="submit" name="ctl00$btnDelete" value="Delete" id="ctl00_btnDelete" disabled="disabled" style="width:80px;" /></td>
                        </tr>
                        <tr>
                            <td style="width: 100px">
                                <input type="submit" name="ctl00$btnSave" value="Save" id="ctl00_btnSave" disabled="disabled" style="width:80px;" />
                                </td>
                        </tr>
                        <tr>
                            <td style="width: 100px;">
                                <input type="submit" name="ctl00$btnPrint" value="Print" id="ctl00_btnPrint" disabled="disabled" style="width:80px;" /></td>
                        </tr>
                        <tr>
                            <td style="width: 100px;">
                                </td>
                        </tr>
                    </table>
                </td>
                <td valign="top" align="left" class="style3">
                   <div>
       
        <a href="#ctl00_ContentPlaceHolder1_Menu1_SkipLink"><img alt="Skip Navigation Links" src="/PHL/WebResource.axd?d=U7_NbLtioTOddYW9GuZAjA2&amp;t=633614924669843750" width="0" height="0" style="border-width:0px;" /></a><table id="ctl00_ContentPlaceHolder1_Menu1" class="ctl00_ContentPlaceHolder1_Menu1_2" cellpadding="0" cellspacing="0" border="0">
      <tr>
            <td onmouseover="Menu_HoverStatic(this)" onmouseout="Menu_Unhover(this)" onkeyup="Menu_Key(this)" title="Filtered Results" id="ctl00_ContentPlaceHolder1_Menu1n0"><table cellpadding="0" cellspacing="0" border="0" width="100%">
                  <tr>
                        <td style="white-space:nowrap;"><a class="ctl00_ContentPlaceHolder1_Menu1_1" href="javascript:__doPostBack('ctl00$ContentPlaceHolder1$Menu1','0')"><img src="../images/selectedtaborigFR.jpg" alt="Filtered Results" style="border-style:none;vertical-align:middle;" /> </a></td>
                  </tr>
            </table></td><td style="width:3px;"></td><td onmouseover="Menu_HoverStatic(this)" onmouseout="Menu_Unhover(this)" onkeyup="Menu_Key(this)" title="Enter Search Criteria" id="ctl00_ContentPlaceHolder1_Menu1n1"><table cellpadding="0" cellspacing="0" border="0" width="100%">
                  <tr>
                        <td style="white-space:nowrap;"><a class="ctl00_ContentPlaceHolder1_Menu1_1" href="javascript:__doPostBack('ctl00$ContentPlaceHolder1$Menu1','1')"><img src="../images/unselectedtabFCNU.jpg" alt="Enter Search Criteria" style="border-style:none;vertical-align:middle;" /> </a></td>
                  </tr>
            </table></td>
      </tr>
</table><a id="ctl00_ContentPlaceHolder1_Menu1_SkipLink"></a>
       
       
                <table width="600" height="400" cellpadding=0 cellspacing=0>
                    <tr valign="top">
                        <td style="width: 600px;
                            background-color: White;
                            font-size: x-small;
                            border-left: 1px solid black;
                            border-bottom: 1px solid black;
                            border-right: 1px solid black;
                            border-top:1px solid black;
                            position:absolute;
                            top:42px;
                            height:400px;
                            z-index:-25">
                            <br />
                            <br />
                            TAB VIEW 1
                            INSERT YOUR CONENT IN HERE
                            CHANGE SELECTED IMAGE URL AS NECESSARY
                        </td>
                    </tr>
                </table>
                     

    </div>
                </td>
    </tr>
            <tr>
                <td colspan="2" bgcolor="#507cd1">
                    <table width="100%">
                        <tr>
                            <td align="left" class="style8">
                                <span id="ctl00_lblFooterText" style="display:inline-block;width:305px;">Copyright © Petro Hydraulic Lift, LLC</span>
                            </td>
                            <td align="left" class="style9"> </td>
                            <td align="right">
                                <table align="right" class="style4">
                                    <tr>
                                        <td align="right" class="style10">
               
                                        </td>
                                        <td>
                   
                                        </td>
                                    </tr>
                                </table>
                            </td>
                        </tr>
                    </table>
                </td>
            </tr>
        </table>
    </div>
   
<div>

      <input type="hidden" name="__EVENTVALIDATION" id="__EVENTVALIDATION" value="/wEWEwL9pubPCALh8vmTCAK33rmJAQL3tfOMCwLktc2qDgK7wfDeAgL2neyqAwLxrLvaAwLRm5ejBQKCtda7BgKQsuOECAL9n+COAgK/+uGyAwKVstuSBQKPpZS+BALV7dAbAvWXkIAMAqHwtNABAr7wtNABqkWXqqexFN+lLc2QF/rWH4blS2I=" />
</div>

<script type="text/javascript">
//<![CDATA[
var ctl00_ContentPlaceHolder1_Menu1_Data = new Object();
ctl00_ContentPlaceHolder1_Menu1_Data.disappearAfter = 500;
ctl00_ContentPlaceHolder1_Menu1_Data.horizontalOffset = 0;
ctl00_ContentPlaceHolder1_Menu1_Data.verticalOffset = 0;
//]]>
</script>
</form>
</body>
</html>
0
 
techpr0Author Commented:
response to viral_sonawa&:

that's what i was doing initally which still didn't work and that's what led me to put it directly in the <td> style attribute to break it down to it's simplist form and so that theirs no url/location conflicts.
0
 
techpr0Author Commented:
response to CtrlAltDl:

Did you put the .aspx in a master page? Because it works fine for me too if the aspx page is not in a master page.
0
 
techpr0Author Commented:
response to prairiedog:
should look like this: ShouldLookLike.jpg
does look like: DoesLookLike.jpg
looks like this in design view (looks correct here, black box/border is present): LooksLikeInDesignView.jpg


DoesLookLike.jpg
LooksLikeInDesignView.jpg
ShouldLookLike.jpg
0
 
techpr0Author Commented:
Sorry guys, it ended up being the z-index and the position attibutes. They don't work well with master pages. I had to put the menu in a table to assign it a z-index then there it was. The z-index was causing it to show up behind everything else on the page. With a few more adjustments I had a usable soloution. I had to do away with the black box around the whole content page and just go with one across the top because the black border on the sides and bottom wouldn't grow/shrink with the page.
0

Featured Post

Technology Partners: We Want Your Opinion!

We value your feedback.

Take our survey and automatically be enter to win anyone of the following:
Yeti Cooler, Amazon eGift Card, and Movie eGift Card!

Tackle projects and never again get stuck behind a technical roadblock.
Join Now