Click here to Skip to main content
15,884,628 members
Articles / Web Development / ASP.NET

MVC Basic Site: Step 1 – Multilingual Site Skeleton

Rate me:
Please Sign up or sign in to vote.
4.90/5 (98 votes)
25 Oct 2013Ms-PL15 min read 406K   16.2K   319  
This article is intended to be the first one from this series and is focused mainly in the creation of a multilingual MVC web site skeleton.
/************** Skin 1 *********************/
.dd
{
	/*display:inline-block !important;*/
	text-align: left;
	/*background-color: #fff; */
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;
	padding: 0 4px 0 8px;
	float: right;
}
.dd .ddTitle
{
	background: #f2f2f2;
	color: Black;
	border: 1px solid #c3c3c3;
	padding: 3px;
	text-indent: 0;
	cursor: default;
	overflow: hidden;
	height: 16px;
}
.dd .ddTitle span.arrow
{
	background: url(Images/dd_arrow.gif) no-repeat 0 0;
	float: right;
	display: inline-block;
	width: 16px;
	height: 16px;
	cursor: pointer;
}

.dd .ddTitle span.ddTitleText
{
	text-indent: 1px;
	overflow: hidden;
	line-height: 16px;
}
.dd .ddTitle span.ddTitleText img
{
	text-align: left;
	padding: 0 2px 0 0;
}
.dd .ddTitle img.selected
{
	padding: 0 3px 0 0;
	vertical-align: top;
}
.dd .ddChild
{
	position: absolute;
	border: 1px solid #c3c3c3;
	border-top: none;
	display: none;
	margin: 0;
	width: auto;
	overflow: auto;
	overflow-x: hidden !important;
	background-color: #ffffff;
}
.dd .ddChild .opta a, .dd .ddChild .opta a:visited
{
	padding-left: 10px;
}
.dd .ddChild a
{
	display: block;
	padding: 2px 0 2px 3px;
	text-decoration: none;
	color: #000;
	overflow: hidden;
	white-space: nowrap;
	cursor: pointer;
}
.dd .ddChild a:hover
{
	background-color: #66CCFF;
}
.dd .ddChild a img
{
	border: 0;
	padding: 0 2px 0 0;
	vertical-align: middle;
}
.dd .ddChild a.selected
{
	text-decoration: none;
	color: #000;
}
.hidden
{
	display: none;
}

.dd .borderTop
{
	border-top: 1px solid #c3c3c3 !important;
}
.dd .noBorderTop
{
	border-top: none 0 !important;
}

/************** Skin 2 *********************/
.dd2
{
	/*display:inline-block !important;*/
	text-align: left;
	background-color: #fff;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;
	float: left;
}
.dd2 .ddTitle
{
	background: transparent url(Images/msDropDown.gif) no-repeat;
	padding: 0 3px;
	text-indent: 0;
	cursor: default;
	overflow: hidden;
	height: 36px;
}
.dd2 .ddTitle span.arrow
{
	background: transparent url(Images/icon-arrow.gif) no-repeat 0 0;
	float: right;
	display: inline-block;
	width: 27px;
	height: 27px;
	cursor: pointer;
	top: 5px;
	position: relative;
	right: 2px;
}

.dd2 .ddTitle span.ddTitleText
{
	text-indent: 1px;
	overflow: hidden;
	line-height: 33px;
	font-family: Georgia, "Times New Roman" , Times, serif;
	font-size: 16px;
	font-weight: bold;
	color: #fff;
	_position: relative;
	_top: 4px;
}
.dd2 .ddTitle span.ddTitleText img
{
	text-align: left;
	padding: 0 2px 0 0;
}
.dd2 .ddTitle img.selected
{
	padding: 0 2px 0 0;
	vertical-align: top;
}
.dd2 .ddChild
{
	position: absolute;
	border: 1px solid #c3c3c3;
	border-top: none;
	display: none;
	margin: 0;
	width: auto;
	overflow: auto;
	overflow-x: hidden !important;
	background-color: #ffffff;
	font-size: 14px;
}
.dd2 .ddChild .opta a, .dd2 .ddChild .opta a:visited
{
	padding-left: 10px;
}
.dd2 .ddChild a
{
	display: block;
	padding: 3px 0 3px 3px;
	text-decoration: none;
	color: #000;
	overflow: hidden;
	white-space: nowrap;
	cursor: pointer;
}
.dd2 .ddChild a:hover
{
	background-color: #66CCFF;
}
.dd2 .ddChild a img
{
	border: 0;
	padding: 0 2px 0 0;
	vertical-align: middle;
}
.dd2 .ddChild a.selected
{
	background-color: #66CCFF;
}

.dd2 .borderTop
{
	border-top: 1px solid #c3c3c3 !important;
}
.dd2 .noBorderTop
{
	border-top: none 0 !important;
}

/************* use sprite *****************/
.dd .ddChild a.sprite, .dd .ddChild a.sprite:visited
{
	background-image: url(Images/sprite.gif);
	background-repeat: no-repeat;
	padding-left: 24px;
}

.dd .ddChild a.calendar, .dd .ddChild a.calendar:visited
{
	background-position: 0 -404px;
}
.dd .ddChild a.shoppingcart, .dd .ddChild a.shoppingcart:visited
{
	background-position: 0 -330px;
}
.dd .ddChild a.cd, .dd .ddChild a.cd:visited
{
	background-position: 0 -439px;
}
.dd .ddChild a.email, .dd .ddChild a.email:visited
{
	background-position: 0 -256px;
}
.dd .ddChild a.faq, .dd .ddChild a.faq:visited
{
	background-position: 0 -183px;
}
.dd .ddChild a.games, .dd .ddChild a.games:visited
{
	background-position: 0 -365px;
}
.dd .ddChild a.music, .dd .ddChild a.music:visited
{
	background-position: 0 -146px;
}
.dd .ddChild a.phone, .dd .ddChild a.phone:visited
{
	background-position: 0 -109px;
}
.dd .ddChild a.graph, .dd .ddChild a.graph:visited
{
	background-position: 0 -73px;
}
.dd .ddChild a.secured, .dd .ddChild a.secured:visited
{
	background-position: 0 -37px;
}
.dd .ddChild a.video, .dd .ddChild a.video:visited
{
	background-position: 0 0;
}
/*******************************/
.ui-jqgrid .ui-jqgrid-htable th div {
height:auto;
overflow:hidden;
padding-right:4px;
padding-top:2px;
position:relative;
vertical-align:text-top;
white-space:normal !important;
}

By viewing downloads associated with this article you agree to the Terms of Service and the article's licence.

If a file you wish to view isn't highlighted, and is a text file (not binary), please let us know and we'll add colourisation support for it.

License

This article, along with any associated source code and files, is licensed under The Microsoft Public License (Ms-PL)


Written By
Romania Romania
I have about 20 years experiences in leading software projects and teams and about 25 years of working experience in software development (SW Developer, SW Lead, SW Architect, SW PM, SW Manager/Group Leader).

Comments and Discussions