469,592 Members | 1,933 Online
Bytes | Developer Community
New Post

Home Posts Topics Members FAQ

Post your question to a community of 469,592 developers. It's quick & easy.

Master Page Content place holder and Cascading Style sheets

Hi All,

I'm relatively new to ASP.NET and Visual Web Developer 2008.
I'm using a Master page with one content place holder.
There is a Cascading Style Sheet file which is being refered by the master page file as follws
"<link href="myStyleSheet.css" rel="Stylesheet" type="text/css"/>"

Part of the Style sheet as follows:
Expand|Select|Wrap|Line Numbers
  1. .textbox
  2. {
  3.     background-color: #FF6600;
  4.     font-family: 'Book Antiqua';
  5.     position: absolute;
  6.     height: 18px;
  7.     width: 268px;
  8.     top: 664px;
  9.     left: 201px;
  10.  
Initially I didn't inserted the top and left style attributes, they came up once I created a textbox and assign the CssClass of it to "textBox"
Expand|Select|Wrap|Line Numbers
  1. <asp:Content ID="Content1" ContentPlaceHolderID="ContentPlaceHolder1" Runat="server">
  2.  
  3. <asp:TextBox ID="txtDesc" runat="server" CssClass="textbox"></asp:TextBox>
  4.  
  5. <asp:TextBox ID="txtRef" runat="server" CssClass="textbox"></asp:TextBox>
  6.  
  7. </asp:Content>
  8.  
---------------------------------------------------------------------------

When ever I put another textbox with same CssClass it appears exactly on top of the previous textbox. Basically both of them share the same top and left attributes and their values. So when ever I try to move the textbox (left and top values change automatically) only that one can be seen.

-----------------------------------------------------------------------------

Moreover If I put another dropdown list or text area they are attached with each other with white strip. (As in the attachment)

-----------------------------------------------------------------------------

My other problem is although I created the server controls in content place holder area they are moving towards left and display on left (When displaying on the browser)

Thnaks a lot, Any help really appriciated...............
Attached Images
File Type: jpg 1.jpg (14.8 KB, 651 views)
May 3 '09 #1
2 9307
Hamayun Khan
106 100+
Remove the below line from css class and check.
Expand|Select|Wrap|Line Numbers
  1.     position: absolute; 
  2.  
Instead u can use I think not must.
Expand|Select|Wrap|Line Numbers
  1.     position: relative;
  2.  
May 5 '09 #2
Frinavale
9,735 Expert Mod 8TB
Why are you positioning your TextBoxes as absolute anyways?

This will make them appear to be on top of the rest of the content.

You could use "relative" instead of "absolute" except that you're going to have the same problem because you're specifying the exact spot that the text box should be rendered.


Basically, with your current style, you are taking your text box out of the normal flow of the web page and placing it in a specific spot (664px from the top and 201px from the left).

Since you're applying this style to more than one text box it is drawing every text box at the same position.....it Should be doing this because this is what you are telling it to do.

What do you really want to do with the text boxes?

Do you want them to appear next to each other in a group and move the group to 664px from the top and 201px from the left?
Do you want them to appear under one another?
Do you want them to be grouped at all????

In regards to the rest of your content moving, it's probably because you're telling it to as well.....
May 5 '09 #3

Post your reply

Sign in to post your reply or Sign up for a free account.

Similar topics

5 posts views Thread by JezB | last post: by
5 posts views Thread by andchoi | last post: by
5 posts views Thread by Peter Walburn | last post: by
2 posts views Thread by Brian | last post: by
1 post views Thread by lamuerte451 | last post: by
4 posts views Thread by Rene | last post: by
1 post views Thread by Mel | last post: by
reply views Thread by suresh191 | last post: by
By using this site, you agree to our Privacy Policy and Terms of Use.