Controls has a different layout

Question

I develop a small web part and I noticed that SharePoint display some of my controls differently or more exactly with different font settings.

My class is deriving from WebPart and use for example a DropDownList, TextBox and a Button, but those controls has not an equal layout.

Here an example:

DropDownList:
font-family: Verdana, sans-serif;
font-size: 11px;

TextBox:
font-family: Arial;
font-size: 13px;

Is that normal? Is it possible to get an equal layout for the controls?

Answer 1

could be for a number of reasons that its comming out like that! I presume you must have some cutom css that is overriding the default css that is causing this effect!

to get around this... within your code if in .cs when creating the controls you can set the .css to the control:

TextBox tb = new TextBox();
tb.ID = "changeCss";
tb.Text - "this is a test";
tb.CssClass = "SetTextOnControl";

Label lblTest = new Label();
lblTest.ID = "label";
lblTest.Text = "This has same style";
lblTest.CssClass = "SetTextOnControl";

or is aspx

    <asp:TextBox ID="changeCss" CssClass="SetTextOnControl" runat="server"></asp:TextBox>
    <asp:Label ID="lblTitle" CssClass="SetTextOnControl" runat="server" ></asp:Label>

and add a css class to your project:

right click your project -> click Add and goto sharepoint layouts mapped folder (click) -> it will create a mapped folder to the layouts folder on 14 hive. Now right click on that new folder and create a new folder within.. give it a meaningfull name... now right click that folder.. goto add and click new item -> wait for popup and click on visual c# on the right, scroll to "style sheet" click on that item and give it a meaningful name and click add. Now it will open the new css file you can put in your new css clas:

.SetTextOnControl
{ 
font-family: Verdana, sans-serif;
font-size: 11px;
}

now goto you .cs file within the webpart so you can add the css to load:

do:

    protected override void OnLoad(EventArgs e)
    {
        base.OnLoad(e);
        Microsoft.SharePoint.WebControls.CssRegistration.Register("/_layouts/yourCustomFolder/myCssFileName.css");

    }

if you want to add it to every page on your site than add it to the masterpage and no need to do the last code part!