DarthSwian:
Can you post your style sheet? Also, you may want to check the rendered html and make sure there were no inline styles overriding your css, which can happen using the visual editor.
I have two stylesheet files:
The main one is default.css:
/* Sets element margins, padding, and border to 0 to even out browser differences when adding desired values later. */
html, body, div, p, h1, h2, h3, h4, h5, h6, blockquote, ol, ul, li, dl, dt, dd, td, form, fieldset, a, img, button {
margin: 0;
padding: 0;
border: 0;
}
/* From Template*/
/* Zero down margin and paddin on all elements */
* {
margin: 0;
padding: 0;
}
body { direction:rtl;
/*font:<span class='val'> <span class='unit'>62.5</span>%/<span class='unit'>1.6</span> "Lucida Grande", "Lucida Sans", "Lucida Sans Unicode", Verdana, sans-serif</span>;*/
background-color:#D4D4D4;
text-align: center;
/*min-width:<span class='val'> <span class='unit'>720</span>px</span>;*/
padding:0px 2px;
margin:0px;
}
#branding h1 {
margin: 0;
}
#mainNav {
list-style: none;
background-color:#fdf7da;/*#eee;*/
}
#secondaryContent {
background-color:#fdf7da;/*#eee;*/
/*margin-right:<span class='val'>-<span class='unit'>3</span>px</span>;
margin-left:<span class='val'><span class='unit'>0</span>px</span>;*/
}
#secondaryContent p {
/*font-size:<span class='val'> <span class='unit'>1.2</span>em</span>;*/
}
/* The Core Technique
================================= */
#wrapper {
width: 98%;
margin: 0;
/*text-align:<span class='val'> right</span>;*/
min-width:720px;
background-color:#fdf7da;
}
#mainNav {
width: 27%;
float: right;
background-color:#fdf7da;
min-width:170px;
/* font-size:<span class='val'><span class='unit'>1</span>em</span>;*/
/*display:<span class='val'>inline</span>;*/
/*padding-right:<span class='val'><span class='unit'>0.5</span>em</span>;*/
}
#content {
width: 71%;
float: left;
min-width:500px;
background-color:#fdf7da;
}
#mcontent {
text-align:center;
width: 65%;
margin-top: 15px;
min-width:340px;
display:inline;
float: right;
background-color:#fdf7da;
}
#secondaryContent {
width: 24%;
/*margin-right:<span class='val'><span class='unit'>0</span>px</span>;
padding:<span class='val'><span class='unit'>0</span>px</span>;*/
min-width: 153px;/*8em;*/
display: inline; /* :KLUDGE:<span class='val'> Fixes IE double margin float bug */
float: left;
}
/* add some padding to the contentse in the main nav and secondary content areas */
#mainNav, #secondaryContent {
padding-top: 20px;
padding-bottom: 20px;
}
/*#mainNav *, #secondaryContent * {
padding-left: 20px;
padding-right: 20px;
}
#mainNav * *, #secondaryContent * * {
padding-left: 0;
padding-right: 0;
}*/
/* From Template*/
body
{
/*font-family:<span class='val'>"Simplified Arabic",Tahoma</span>;*/
font-size:18px;
font-weight:bold;
color:#000000;
direction:rtl;
}
h1, h2 {color:#FFFFFF;}
h3, h4, h5, h6 {color:#666666;}
h1, h2, h3, h4, h5, h6 {color:#444444;}
/*Typographics styles adapted from http://www.thenoodleincident.com/tutorials/typography/ */
h1 {
margin-top:1em;
font-size: 1.4em;
font-weight: bold;
}
h2 {
margin-top:0.5em;
font-size: 1.4em;
font-family:Simplified Arabic,Tahoma;
font-weight: bold;
}
h3 {
margin: 0.5em 0;
font-size: 1.2em;
font-weight: normal;
}
h4 {
font-size: 1em;
font-weight: bold;
color:#FFF;
height:20px;
}
h5 {
margin: 0.5em 0;
font-size: 1.0em;
font-weight: bold;
}
h6 {
margin: 0.5em 0;
font-size: 0.8em;
font-weight: bold;
}
p {margin: 1em 0;}
a {text-decoration:underline;}
a:hover {text-decoration:none;}
#header{
height: 179px;
margin: 0 auto;
position: relative;
background-repeat: no-repeat;
}
#logo
{
float:right;
position:relative;
width: 540px;
height: 179px;
display:inline;
background-image: url(images/header.gif);
}
#branding
{
min-width:720px;
background:url('images/headerImage.gif') top right;
height: 179px;
background-color:#b0b0b0;
width:100%;
}
#logoextend{margin:0px;
float:left;
width:32.6%;
position:relative;
display:inline;
height: 179px;
background:url('images/headertrick4.gif') top right;
}
#banner{
margin:0 152px;
text-align:center;
position:relative;
}
#search{
position:absolute;
top:150px;
left:5px;
}
#contentwrapper{
width: 998px; /*468px;*/ /*** Critical left and right col/divider dimension value (moves inversly) ***/
border-left: 1px solid #FFFFFF; /*** Critical left divider dimension value ***/
border-right: 1px solid #FFFFFF; /*** Critical right divider dimension value ***/
}
* html #contentwrapper { /*** IE5.x/win box model fix ***/
width: 1000px; /*** Critical left and right col/divider dimension value (moves inversly) ***/
width: 998px; /*** Critical left and right col/divider dimension value (moves inversly) ***/
}
#floatwrapper {
float: left;
width: 80%; /*** Critical left and right col/divider dimension value (moves inversly) ***/
margin-right: -1px; /*** Static fix ***/
}
#centercolumn{
float: right;
/*width:<span class='val'> <span class='unit'>635</span>px</span>;*/ /*** Critical left and right col/divider dimension value (moves inversly) ***/
/* \*/
margin-left: -1px;
/* Hidden from IE-mac */
padding-top:0px;
}
#copy a {color:#FF284E;}
#copy .container
{
/*width:<span class='val'><span class='unit'>620</span>px</span>;*/
margin:5px 0 5px 0px;
padding:0 5px 15px 5px;
text-align:right;
background:url(Images/bg.gif) repeat-y top right ;
border-top: solid 2px #E7E7E7;
border-left: solid 2px #D2D2D2;
border-bottom: solid 2px #D2D2D2;
border-right: solid 2px #E7E7E7;
background-color:White;
min-width:320px;
}
#copy .container h1, #copy .container h2 {
/*margin:<span class='val'> <span class='unit'>0</span> -<span class='unit'>20</span>px</span>;*/
margin:0px;
padding: 3px 20px 2px 20px;
color:#000000;
}
#copy .container .articletitle a
{
color:#FF6C00;
font-size:14px;
}
#copy .container .articleabstract
{
font-size:12px;
clear:both;
font-family:Tahoma;
width:97%;
padding:2px;
}
.articleabstract
{
clear:both;
}
.container-two-columns
{
width:97%;
float:left;
margin:5px;
padding:0 5px 20px 5px;
text-align:right;
background:url(Images/side_nav_bg.jpg) repeat-x left top ;
border-top: solid 2px #E7E7E7;
border-left: solid 2px #D2D2D2;
border-bottom: solid 2px #D2D2D2;
border-right: solid 2px #E7E7E7;
background-color:#f2f2f2;
}
/* \*/
* html .container-two-columns {height:1%;}
/* */
.container-two-columns a{color:#FF6C00;}
.AdminDefaultBody
{
padding-right:20px;
}
/*#<span class='sel'>copy</span> <span class='sel'>td</span>, #<span class='sel'>copy</span> <span class='sel'>th</span> {padding:<span class='val'> <span class='unit'>0.2</span>em <span class='unit'>0.5</span>em</span>;}
#<span class='sel'>copy</span> .<span class='sel'>container</span> <span class='sel'>table</span> <span class='sel'>tr</span> {font-size:<span class='val'><span class='unit'>0.9</span>em</span>;}*/
#copy a{ color:Green;}
.button {
border:1px solid #FFFFFF;
color:#FFFFFF;
background-color:#FF9900;
font-size:1em;
}
#copy .container .button {border-color:#CCCCCC;}
#leftcolumn
{
float:left;
width: 130px; /*** Critical left col/divider dimension value ***/
padding-top:0px;
}
* html #leftcolumn {
float:left;
padding-top:0px;
}
*>html #leftcolumn {width:161px;} /*** Fix only for IE/Mac ***/
/*** This is a fix for IE5/Win at the largest text size setting. ***/
/* \*/
* html #leftcolumn {margin-right: -3px;}
/* */
#leftcolcontainer{
width: 100px; /*** Critical left col dimension value ***/
}
#rightcolumn{
float: right;
width: 10%; /*** Critical right col/divider dimension value ***/
margin-left: -1px; /*** Static fix ***/
padding-top: 0px;
}
/* \*/
* html #rightcolumn {
padding-top:0px;
}
/* */
/*** These commented-out rules below are there to explain the "Critical" info
for the rules above, because comments must not appear within the Mac-hack.
The "rules" below are not active, they are just for teaching purposes. ***/
/*
* <span class='sel'>html</span> .<span class='sel'>right</span> {
margin-left:<span class='val'> <span class='unit'>0</span>px</span>; *** Critical right divider dimension value ***
margin-right:<span class='val'> -<span class='unit'>500</span>px</span>; *** IE5.x/win fix, must be above a critical number, but very high values appear okay ***
mar\gin-right:<span class='val'> -<span class='unit'>152</span>px</span>; *** Critical right col/divider dimension value ***
}
*/
.sidebarcontainer{
margin:5px;
padding:0px 0px 6px 0px;
border:1px solid #FFFFFF;
background-color:#f3f3f3;
font-size:smaller;
text-align:right;
width:150px;
}
/* \*/
* html .sidebarcontainer {height:1%;}
/* */
.sidebarcontainer a {color:#FF6C00;}
.sidebarcontainer li {list-style-type:none;}
.sidebarcontainer h4 {
padding: 0 20px 2px 20px;
color:Red;
background-color:#077F02;
background:url(images/section.gif) no-repeat ;
text-align:center;
line-height:20px;
}
#footer {
clear:both;
padding-top:10px;
width:98%;
height:26px;
font-size:0.7em;
/* margin-top:<span class='val'><span class='unit'>20</span>px</span>;*/
background:url(images/footer.gif) no-repeat center;
}
/*#<span class='sel'>footer</span> {
clear:<span class='val'>both</span>;
text-align:<span class='val'>center</span>;
margin:<span class='val'><span class='unit'>1</span>px <span class='unit'>5</span>px</span>;
padding:<span class='val'><span class='unit'>2</span>px <span class='unit'>20</span>px</span>;
border:<span class='val'><span class='unit'>1</span>px solid #<span class='unit'>999999</span></span>;
background-color:<span class='val'>#<span class='unit'>FFFFFF</span></span>;
font-size:<span class='val'><span class='unit'>0.9</span>em</span>;
background:<span class='val'>url(images/footer.gif) no-repeat </span>;
}*/
#newsletterboxcontent
{
padding:0 5px;
font-family:0.5em;
}
#footer a {
margin:1px 5px;
color:#FF284E;
}
.imgfloatright {
float:right;
display:inline;
margin: 0.25em 0 0.25em 1em;
}
.imgfloatleft {
float:left;
display:inline;
margin: 0.25em 1em 0.25em 0;
}
@media print
{
body{
font-size:11pt;
line-height:13pt;
background:#FFFFFF !important;
}
#wrapper, #contentwrapper, #floatwrapper, #centercolumn, * html #wrapper, * html #contentwrapper, * html #floatwrapper, * html #centercolumn {
width:auto !important;
margin:auto !important;
}
#wrapper, #contentwrapper {border:none;}
#mainnav{
padding:0;
text-align:center;
}
#leftcolumn, #rightcolumn, #search {display:none;}
#wrapper, #header, #mainnav, #mainnav .item, #mainnav .selected, #copy .container, #footer {
background:transparent;
}
#centercolumn {
float:none;
margin:0 1em 0 2.5em;
}
#breadcrumbs {position:static;}
#copy .container{
margin:0;
padding:0 !important;
border-style:none !important;
border-width:0;
}
#copy fieldset {border:none;}
/*#<span class='sel'>footer</span>
{
clear:<span class='val'>both</span>;
border-style:<span class='val'>none !important</span>;
border-top:<span class='val'><span class='unit'>1</span>px solid #<span class='unit'>000000</span></span>;
}*/
}
/*Added by nabeel*/
.stand
{
float:right;
}
.stand-in
{padding:0px 5px;
background-color:#FFF7E7;
color:#8C4510;border:solid 3px #DEBA84;
}
.ptitle
{
background-color:#A55129;Font-weight:bold;
color:White;border:solid 3px #DEBA84; padding:3px 1px;
}
.hid
{
display:none;
}
.sectiontitle
{
font-weight:bold;
font-size:1.2em;
}
.postbody
{
text-align:right;
word-break:break-all;
padding:5px;
width:90%;
}
.longtextcss
{
word-break:break-all;
}
.mempad
{
padding:5px;
}
.posttitle
{
font-size:1.5em;
}
.box
{margin:0px;
display:inline;
width:400px;background:url(images/forBorder2.gif) repeat-y;float:right;
}
.box h2
{
background:url(images/forBorder1.gif) no-repeat left top;
padding-top:25px;
padding-left:20px;
padding-right:30px;
padding-bottom:0px;
margin:0px;
}
.box p
{
margin:0px;
background:url(images/forBorder3.gif) no-repeat left bottom;
padding-bottom:23px;
padding-left:20px;
padding-right:30px;
padding-top:0px;
}
.direc
{
direction:rtl;
text-align:right;
}
/*Added by nabeel*/
The tree skin is as following:
<asp:TreeView SkinId="ExplorerLines"
RootNodeStyle-ImageUrl="images/MenuMain.gif"
ParentNodeStyle-ImageUrl="images/MenuContainer.gif"
LeafNodeStyle-ImageUrl="images/MenuAlone.gif"
NodeStyle-Font-Names="tahoma"
NodeStyle-Font-Size="8pt"
NodeStyle-HorizontalPadding="3px"
NodeStyle-ForeColor="DarkBlue"
NodeStyle-Font-Bold="false"
RootNodeStyle-Font-Bold="true"
SelectedNodeStyle-ForeColor="White"
SelectedNodeStyle-BackColor="DarkBlue"
HoverNodeStyle-Font-Underline="true"
runat="server"
/>server" HoverNodeStyle-Font-Underline="true" SelectedNodeStyle-BackColor="DarkBlue" SelectedNodeStyle-ForeColor="White" RootNodeStyle-Font-Bold="true" NodeStyle-Font-Bold="false" NodeStyle-ForeColor="DarkBlue" NodeStyle-HorizontalPadding="3px" NodeStyle-Font-Size="8pt" NodeStyle-Font-Names="tahoma" LeafNodeStyle-ImageUrl="images/MenuAlone.gif" ParentNodeStyle-ImageUrl="images/MenuContainer.gif" RootNodeStyle-ImageUrl="images/MenuMain.gif" SkinId="ExplorerLines">
The Template html code:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<%@ Master Language="C#" AutoEventWireup="true" CodeFile="Template.master.cs" Inherits="AppMaster" %>
<html xmlns="http://www.w3.org/1999/xhtml" lang="en" xml:lang="en">
<head runat="server">
<title>title of the website in arabic</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta name="description" content="som econtent"/>
<script src="SpryAssets/SpryTabbedPanels.js" type="text/javascript"></script>
<link rel="stylesheet" href="PhotoAlbum/css/lightbox.css" type="text/css" media="screen" />
<link href="SpryAssets/SpryTabbedPanels.css" rel="stylesheet" type="text/css" />
<script src="SpryAssets/SpryCollapsiblePanel.js" type="text/javascript"></script>
<script type="text/javascript">
function setMaxLength(obj, intLen)
{
if (obj.getAttribute && obj.value.length > intLen)
{
obj.value=obj.value.substring(0,intLen);
alert(intLen+"الحد الأقصى من الحروف في هذه الخانة ");
}
}
</script>
<link href="SpryAssets/SpryCollapsiblePanel.css" rel="stylesheet" type="text/css" />
<link runat="server" rel="stylesheet" href="~/CSS/Import.css" type="text/css" id="AdaptersInvariantImportCSS" />
<![if !IE]>
<link rel="stylesheet" runat="server" type="text/css" href="~/FirefoxSheet.css"/>
<![endif]>
<!--[if IE 6]>
<link rel="stylesheet" type="text/css" href="~/NabIE6.css"/>
<![endif]-->
<style>
.nabtree td div
{
height:20px !important;
padding-top:0px !important;
padding-bottom:0px !important;
/*Background-color:Black;*/
}
</style>
</head>
<body>
<form id="mainForm" runat="server">
<div id="wrapper">
<div id="branding">
<div id="but">
<ul>
<li>
<asp:HyperLink ID="HyperLink1" runat="server" NavigateUrl="~/Default.aspx" ImageUrl="images/mainb.gif"></asp:HyperLink>
</li>
<li>
<asp:HyperLink ID="HyperLink2" runat="server" NavigateUrl="~/contents/item.aspx?id=506"
ImageUrl="images/mainb3.gif"></asp:HyperLink>
</li>
<li>
<asp:HyperLink ID="HyperLink3" runat="server" NavigateUrl="~/contents/item.aspx?id=192"
ImageUrl="images/mainb2.gif"></asp:HyperLink>
</li>
</ul>
</div>
</div>
<div id="newsmove" style="margin-top:3px;">
<div id="bar" style="width:98%; font-family:Tahoma;" >
<marquee direction="left" style="margin-right:20%" scrollamount="4" width="75%" onmouseover="this.stop()" loop="true"
onmouseout="this.start()">
<asp:PlaceHolder ID="PlaceHolder1" runat="server"></asp:PlaceHolder></marquee>
</div>
</div>
<div id="content">
<asp:ContentPlaceHolder ID="MainContent" runat="server">
</asp:ContentPlaceHolder>
</div>
<div id="mainNav">
<div id="menu">
<div id="menuHeader">
</div>
<div id="menuBody">
<asp:SiteMapDataSource ID="stmp" runat="server"/>
<asp:SiteMapDataSource ID="SiteMapDataSource1" runat="server"/>
<asp:TreeView ID="TreeView1" CssClass="nabtree" DataSourceID="stmp"
ShowExpandCollapse="true"
SkinID="ExplorerLines" NodeIndent="1" NodeStyle-Font-Bold="false" LeafNodeStyle-HorizontalPadding="1"
ExpandDepth="3" ParentNodeStyle-HorizontalPadding="1"
MaxDataBindDepth="3" EnableViewState="true"
runat="server" ShowLines="True" LineImagesFolder="~/TreeLineImages"/>
</div>
<div id="menuFooter">
</div>
</div>
<asp:ContentPlaceHolder ID="RightContent1" runat="server">
</asp:ContentPlaceHolder>
</div>
<div id="footer">
<div style="text-align:center;">
arabic text for footer </div>
<asp:ContentPlaceHolder ID="FooterContent" runat="server">
</asp:ContentPlaceHolder>
</div>
</div>
</form>
</body>
</html>
About the Treeview it has a strange problem in Firefox which you can see in the following post:
http://forums.asp.net/t/1282481.aspx
The second css file is as following:
.Tender-Header
{
background: url(images/header_bg.gif) repeat-x top left;
height:40px;
padding:2px 30px;
margin:0px;
}
.Tender-Row
{
background: url(images/row_bg.jpg) repeat-x top left;
height:40px;
text-align:center;
}
.Tender-Details-Header
{
width:150px;
height:30px;
padding-right:5px;
}
.Tender-Details-row
{
padding-right:5px;
}
.TabContainer
{
font: bold 0.75em Verdana;
width: 400px;
margin-top: 1.5em;
padding-top: 2em;
}
.TabItemInactive
{
border-top: 1px solid white;
border-left: 1px solid white;
border-right: 1px solid #aaaaaa;
border-bottom: none;
background-color: #d3d3d3;
text-align: center;
text-decoration: none;
padding: 0.75em 0.25em 0 0.25em;
}
.TabItemInactive:hover
{
background: #808080;
}
.TabItemActive
{
border-top: 1px solid white;
border-left: none;
border-right: 1px solid #aaaaaa;
border-bottom: none;
text-decoration: none;
background-color: #bbbbbb;
text-align: center;
padding: 0.75em 0.25em 0 0.25em;
}
.ContentPanel
{
background-color: #bbbbbb;
padding: 10px 10px 10px 10px;
width: 400px;
font: 0.8em Verdana;
}
.newsbox
{
position:relative;
border-top: solid 2px #E7E7E7;
border-left: solid 2px #D2D2D2;
border-bottom: solid 2px #D2D2D2;
border-right: solid 2px #E7E7E7;
background:url(Images/row_bg.jpg) repeat-x top ;
padding:2px 3px;
background-color:#fff;
/*width:<span class='val'><span class='unit'>100</span>%</span>;*/
height:120px;
}
.fixednewsbox
{
padding-right:5px;
margin-top:20px;
margin-bottom:20px;
border-top: solid 2px #E7E7E7;
border-left: solid 2px #D2D2D2;
border-bottom: solid 2px #D2D2D2;
border-right: solid 2px #E7E7E7;
background:url(Images/row_bg.jpg) repeat-x top ;
background-color:#fff;
}
.pollbox
{
font-size: 13px;
direction:rtl;
}
.pollcontent
{
padding: 6px;
}
.pollquestion
{
font-size: 14px;
font-weight: bold;
}
.polloptions
{
padding-top: 10px;
padding-bottom: 4px;
padding-right:0px;
}
.pollbar
{
background-color: Orange;
font-size: 4px;
}
.RegfirstFeild
{
width:100px;
font-size:14px;
font-weight:bold;
color:Black;
border-style:solid;
border-color:White;
border-width:1px;
background-color:#A9C356;
}
.firstFeild
{
width:100px;
font-size:14px;
font-weight:bold;
color:Black;
border-style:solid;
border-color:White;
border-width:1px;
background-color:#A9C356;
}
.RedValid
{
color:Red;
}
#login
{
padding-right:10px;
}
#Assir_Map
{
text-align:center;
padding-top:5%;
}
#bulLinks { padding: 1em; margin-left: 0;}
#bulLinks li { list-style: none; margin: 0; }
#bulLinks li a
{
width: 160px;
display: block;
color: #777;
text-decoration: none;
padding: 0.5em 0 0.5em 0;
font-family: Tahoma, Simplified Arabic ;
font-size: 11px;
font-weight:bold;
}
#bulLinks li a:hover
{
color: #800000;
}
.siteLinks a
{
width: 160px;
display: block;
color: #777;
text-decoration: none;
padding: 0.5em 0 0.5em 0;
font-family: Tahoma, Simplified Arabic ;
font-size: 11px;
font-weight:bold;
}
.siteLinks a:hover
{
color: #800000;
}
.dir
{
direction:rtl;
}
#but
{
width: 180px;
height: 179px;
display:inline;
background-image:url('images/headertrick3.gif');
margin: 0;
float: right;
}
#but ul
{
margin: 0;
padding: 0;
list-style: none;
}
#but ul li
{
display:inline;
}
#but ul li a
{
display: block;
width:47px;
height:50px;
float:right;
border-left:dashed;
border-left-width:thin;
border-left-color:#999999;
padding-left:7px;
}
.menu
{ direction:rtl;
min-width:200px;
/* margin-bottom:<span class='val'><span class='unit'>30</span>px</span>;*/
background-color:#fdf7da;
/*text-decoration:<span class='val'>none</span>;*/
}
#menuHeader
{
height:30px; width:200px;
background:url('images/treeBack_01.gif') no-repeat ;
}
#menuBody
{/*min-height:<span class='val'><span class='unit'>350</span>px</span>;*/
width:200px;
/*text-decoration:<span class='val'>none</span>;*/
text-align:right;
background-image:url('images/treeBack_03.gif');
}
#menuFooter
{
height:33px; width:200px;
background:url('images/treeBack_05.gif') no-repeat;
}
/*.<span class='sel'>menu</span> <span class='sel'>table</span> <span class='sel'>tr</span> {
height:<span class='val'><span class='unit'>25</span>px</span>;
padding:<span class='val'><span class='unit'>0</span></span>;
margin:<span class='val'><span class='unit'>0</span></span>;
font-size:<span class='val'><span class='unit'>8</span>px</span>;
}*/
#DOWN
{
width:100%;
text-align:center;
font-size:13px;
padding:5px 0;
}
#newsmove {
width: 100%;
min-width:720px;
background: url('images/NewsBar.gif') top right no-repeat;
height: 24px;
padding:0px;
}
#newsmove a {
color:Black;
font-size:12px;
}
#newsmove #bar
{
top: -5px;
}
.tree td div
{
height:20px !important;
}