Kompx.com or Compmiscellanea.com

JavaScript + CSS centering

Windows : Internet Explorer 6.0+, Firefox 1.0+, Google Chrome, Opera 9.0+ [ 1 ], Safari 3.1+, SeaMonkey 1.0+.

Linux : Firefox 1.0+, Chromium, Opera 9.0+ [ 2 ], SeaMonkey 1.0+.

Centering content of a web page by means of JavaScript and CSS. A block containing the content of a page is JavaScript + CSS centered horizontally and vertically. Two cases:

1. A block is centered, if screen resolution is equal to or greater than 1024x768 - [ Open demo page ]

2. A block is centered, if screen resolution is equal to or greater than 1024x768 + mouse cursor is moved over a link in an element of the page content - [ Open demo page ]

JavaScript and CSS horizontal and vertical centering. The first case. Step by step.

1. A web page, the part of which is going to be the element the JavaScript + CSS horizontal and vertical centering is to be applied to:

HTML / XHTML. Code:

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

<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">

<head>

<title>JavaScript + CSS horizontal and vertical centering. The first case. Step 1</title>

<meta http-equiv="Content-Type" content="text/html; charset=Windows-1252" />

<link rel="stylesheet" type="text/css" href="1.css" />

</head>

<body>

 

</body>

</html>

CSS. Code:

html {height: 100%; margin: 0px;}

body {background-color: #fff; margin: 0px; height: 100%;}

2. A block element A (grey color) with dimensions declared explicitly, for instance 800 by 500 pixels and with relative positioning is created in the document's body. [ Open demo page ]

HTML / XHTML. Code:

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

<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">

<head>

<title>JavaScript + CSS horizontal and vertical centering. The first case. Step 2</title>

<meta http-equiv="Content-Type" content="text/html; charset=Windows-1252" />

<link rel="stylesheet" type="text/css" href="2.css" />

</head>

<body>

<div class="element_A">&nbsp;</div>

</body>

</html>

CSS. Code:

html {height: 100%; margin: 0px;}

body {background-color: #fff; margin: 0px; height: 100%;}

.element_A {position: relative; top: 0px; left: 0px; width: 800px; height: 500px; background-color: #999;}

3. External JavaScript file ( JavaScript code with commentary and explanations ) is prepared for user's web browser and display device capabilities detection, for the necessary manipulations to achieve the horizontal and vertical centering of element A under the specified condition (screen resolution equal to or greater than 1024x768). Link to this external JavaScript file is placed between the <head></head> tags of the XHTML / HTML file. [ Open demo page ]

HTML / XHTML. Code:

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

<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">

<head>

<title>JavaScript + CSS horizontal and vertical centering. The first case. Step 3</title>

<meta http-equiv="Content-Type" content="text/html; charset=Windows-1252" />

<link rel="stylesheet" type="text/css" href="3.css" />

<script type="text/javascript" src="3.js"></script>

</head>

<body>

<div class="element_A" id="element_A">&nbsp;</div>

</body>

</html>

CSS. Code:

html {height: 100%; margin: 0px;}

body {background-color: #fff; margin: 0px; height: 100%;}

.element_A {position: relative; top: 0px; left: 0px; width: 800px; height: 500px; background-color: #999;}

JavaScript. Code:

var wresolution=screen.width;

var hresolution=screen.height;

function centering(){

if(wresolution>=1024 && hresolution>=768){

if(window.getComputedStyle){

var h=document.documentElement.clientHeight;

var w=document.documentElement.clientWidth;

var element_A = window.getComputedStyle(document.getElementById('element_A'), '');

var element_A_width=parseInt(element_A.getPropertyValue('width'));

var element_A_height=parseInt(element_A.getPropertyValue('height'));

document.getElementById('element_A').style.left=(w-element_A_width)/2+'px';

document.getElementById('element_A').style.top=(h-element_A_height)/2+'px';

}

else{

var h2=document.documentElement.clientHeight;

var w2=document.documentElement.clientWidth;

var element_A=document.getElementById('element_A');

var element_A_width=parseInt(element_A.currentStyle.width);

var element_A_height=parseInt(element_A.currentStyle.height);

document.getElementById('element_A').style.left=(w2-element_A_width)/2+'px';

document.getElementById('element_A').style.top=(h2-element_A_height)/2+'px';

};

window.onresize=centering;

};

};

window.onload=centering;

The JavaScript + CSS horizontal and vertical centering, sample page, aggregate result [ Open demo page ] [ Download archive file ].

HTML / XHTML. Code:

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

<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">

<head>

<title>JavaScript + CSS horizontal and vertical centering. The first case. Aggregate result</title>

<meta http-equiv="Content-Type" content="text/html; charset=Windows-1252" />

<link rel="stylesheet" type="text/css" href="javascript-css-vyravnivanie.css" />

<script type="text/javascript" src="javascript-css-vyravnivanie.js"></script>

</head>

<body>

<div class="element_A" id="element_A">

<div class="box">

<div class="site"><span class="sitecontent"><a href="http://www.compmiscellanea.com/" class="sitelink">compmiscellanea.com</a></span></div>

<h1><span class="title"><span class="titlecontent"><a href="javascript-css-centering.htm" class="titlelink">JavaScript + CSS centering</a></span></span></h1>

</div>

</div>

</body>

</html>

CSS. Code:

html {height: 100%; margin: 0px;}

body {background-color: #fff; margin: 0px; height: 100%;}

.element_A {position: relative; top: 0px; left: 0px; width: 800px; height: 500px; background-color: #999;}

/*---------------- element A content ----------------*/

h1 {font-weight: normal; margin: 0px; float: left; font-family: "Times New Roman", "Liberation Serif", serif; font-size: 25px; color: #fff;}

.box {position: relative; top: 0px; left: 45px; width: 708px; height: 408px; float: left; border: 1px solid #fff; margin-top: 45px;}

.site {position: relative; top: 0px; left: 0px; width: 708px; height: auto; float: left; margin-top: 152px; text-align: center;}

.sitecontent {position: relative; top: 0px; left: 0px; height: auto; width: auto; margin: auto; display: table; display: inline-block; text-align: left;}

.title {position: relative; top: 0px; left: 0px; width: 708px; height: auto; float: left; text-align: center;}

.titlecontent {position: relative; top: 0px; left: 0px; width: auto; height: auto; margin: auto; display: table; display: inline-block; text-align: left; word-spacing: 2px;}

a.sitelink:link {font-family: "Times New Roman", "Liberation Serif", serif; font-size: 48px; color: #000000; font-weight: normal; text-decoration: none; text-transform: uppercase; float: left;}

a.sitelink:visited {font-family: "Times New Roman", "Liberation Serif", serif; font-size: 48px; color: #000000; font-weight: normal; text-decoration: none; text-transform: uppercase; float: left;}

a.sitelink:hover {font-family: "Times New Roman", "Liberation Serif", serif; font-size: 48px; color: #cc0000; font-weight: normal; text-decoration: none; text-transform: uppercase; float: left;}

a.sitelink:active {font-family: "Times New Roman", "Liberation Serif", serif; font-size: 48px; color: #000000; font-weight: normal; text-decoration: none; text-transform: uppercase; float: left;}

a.titlelink:link {font-family: "Times New Roman", "Liberation Serif", serif; font-size: 28px; color: #fff; font-weight: normal; text-decoration: none; float: left;}

a.titlelink:visited {font-family: "Times New Roman", "Liberation Serif", serif; font-size: 28px; color: #fff; font-weight: normal; text-decoration: none; float: left;}

a.titlelink:hover {font-family: "Times New Roman", "Liberation Serif", serif; font-size: 28px; color: #cc0000; font-weight: normal; text-decoration: none; float: left;}

a.titlelink:active {font-family: "Times New Roman", "Liberation Serif", serif; font-size: 28px; color: #fff; font-weight: normal; text-decoration: none; float: left;}

/*---------------- element A content ----------------*/

JavaScript. Code:

var wresolution=screen.width;

var hresolution=screen.height;

function centering(){

if(wresolution>=1024 && hresolution>=768){

if(window.getComputedStyle){

var h=document.documentElement.clientHeight;

var w=document.documentElement.clientWidth;

var element_A=window.getComputedStyle(document.getElementById('element_A'), '');

var element_A_width=parseInt(element_A.getPropertyValue('width'));

var element_A_height=parseInt(element_A.getPropertyValue('height'));

document.getElementById('element_A').style.left=(w-element_A_width)/2+'px';

document.getElementById('element_A').style.top=(h-element_A_height)/2+'px';

}

else{

var h2=document.documentElement.clientHeight;

var w2=document.documentElement.clientWidth;

var element_A=document.getElementById('element_A');

var element_A_width=parseInt(element_A.currentStyle.width);

var element_A_height=parseInt(element_A.currentStyle.height);

document.getElementById('element_A').style.left=(w2-element_A_width)/2+'px';

document.getElementById('element_A').style.top=(h2-element_A_height)/2+'px';

};

window.onresize=centering;

};

};

window.onload=centering;

JavaScript and CSS horizontal and vertical centering. The second case. Step by step.

1. A web page, the part of which is going to be the element the JavaScript + CSS horizontal and vertical centering is to be applied to:

HTML / XHTML. Code:

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

<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">

<head>

<title>JavaScript + CSS horizontal and vertical centering. The second case. Step 1</title>

<meta http-equiv="Content-Type" content="text/html; charset=Windows-1252" />

<link rel="stylesheet" type="text/css" href="1.css" />

</head>

<body>

 

</body>

</html>

CSS. Code:

html {height: 100%; margin: 0px;}

body {background-color: #fff; margin: 0px; height: 100%;}

2. A block element A (grey color) with dimensions declared explicitly, for instance 800 by 500 pixels and with relative positioning is created in the document's body. [ Open demo page ]

HTML / XHTML. Code:

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

<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">

<head>

<title>JavaScript + CSS horizontal and vertical centering. The second case. Step 2</title>

<meta http-equiv="Content-Type" content="text/html; charset=Windows-1252" />

<link rel="stylesheet" type="text/css" href="2.css" />

</head>

<body>

<div class="element_A">&nbsp;</div>

</body>

</html>

CSS. Code:

html {height: 100%; margin: 0px;}

body {background-color: #fff; margin: 0px; height: 100%;}

.element_A {position: relative; top: 0px; left: 0px; width: 800px; height: 500px; background-color: #999;}

3. External JavaScript file ( JavaScript code with commentary and explanations ) is prepared for user's web browser and display device capabilities detection, for the necessary manipulations to achieve the horizontal and vertical centering of element A under the specified condition (screen resolution equal to or greater than 1024x768) + for the specified action (moving mouse cursor over a link in element A). Link to this external JavaScript file is placed between the <head></head> tags of the XHTML / HTML file. A link with onMouseOver event handler and with appropriate script is created in the element A. [ Open demo page ]

HTML / XHTML. Code:

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

<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">

<head>

<title>JavaScript + CSS horizontal and vertical centering. The second case. Step 3</title>

<meta http-equiv="Content-Type" content="text/html; charset=Windows-1252" />

<link rel="stylesheet" type="text/css" href="3.css" />

<script type="text/javascript" src="3.js"></script>

</head>

<body>

<div class="element_A" id="element_A">

<a href="javascript-css-centering.htm" class="link" onmouseover="centering();"> JavaScript + CSS centering </a>

</div>

</body>

</html>

CSS. Code:

html {height: 100%; margin: 0px;}

body {background-color: #fff; margin: 0px; height: 100%;}

.element_A {position: relative; top: 0px; left: 0px; width: 800px; height: 500px; background-color: #999; text-align: center;}

a.link:link {font-family: "Times New Roman", "Liberation Serif", serif; font-size: 33px; color: #fff; font-weight: normal; text-decoration: none; position: relative; top: 44%;}

a.link:visited {font-family: "Times New Roman", "Liberation Serif", serif; font-size: 33px; color: #fff; font-weight: normal; text-decoration: none; position: relative; top: 44%;}

a.link:hover {font-family: "Times New Roman", "Liberation Serif", serif; font-size: 33px; color: #cc0000; font-weight: normal; text-decoration: none; position: relative; top: 44%;}

a.link:active {font-family: "Times New Roman", "Liberation Serif", serif; font-size: 33px; color: #fff; font-weight: normal; text-decoration: none; position: relative; top: 44%;}

JavaScript. Code:

var wresolution=screen.width;

var hresolution=screen.height;

function centering(){

if(wresolution>=1024 && hresolution>=768){

if(window.getComputedStyle){

var h=document.documentElement.clientHeight;

var w=document.documentElement.clientWidth;

var element_A=window.getComputedStyle(document.getElementById('element_A'), '');

var element_A_width=parseInt(element_A.getPropertyValue('width'));

var element_A_height=parseInt(element_A.getPropertyValue('height'));

document.getElementById('element_A').style.left=(w-element_A_width)/2+'px';

document.getElementById('element_A').style.top=(h-element_A_height)/2+'px';

}

else{

var h2=document.documentElement.clientHeight;

var w2=document.documentElement.clientWidth;

var element_A=document.getElementById('element_A');

var element_A_width=parseInt(element_A.currentStyle.width);

var element_A_height=parseInt(element_A.currentStyle.height);

document.getElementById('element_A').style.left=(w2-element_A_width)/2+'px';

document.getElementById('element_A').style.top=(h2-element_A_height)/2+'px';

};

window.onresize=centering;

};

};

The JavaScript + CSS horizontal and vertical centering, sample page, aggregate result [ Open demo page ] [ Download archive file ].

HTML / XHTML. Code:

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

<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">

<head>

<title>JavaScript + CSS horizontal and vertical centering. The second case. Aggregate result</title>

<meta http-equiv="Content-Type" content="text/html; charset=Windows-1252" />

<link rel="stylesheet" type="text/css" href="javascript-css-vyravnivanie.css" />

<script type="text/javascript" src="javascript-css-vyravnivanie.js"></script>

</head>

<body>

<div class="element_A" id="element_A">

<div class="box">

<div class="site"><span class="sitecontent"><a href="http://www.compmiscellanea.com/" class="sitelink">compmiscellanea.com</a></span></div>

<h1><span class="title"><span class="titlecontent"><a href="javascript-css-centering.htm" class="titlelink" onmouseover="centering();" >JavaScript + CSS centering</a></span></span></h1>

</div>

</div>

</body>

</html>

CSS. Code:

html {height: 100%; margin: 0px;}

body {background-color: #fff; margin: 0px; height: 100%;}

.element_A {position: relative; top: 0px; left: 0px; width: 800px; height: 500px; background-color: #999;}

/*---------------- element A content ----------------*/

h1 {font-weight: normal; margin: 0px; float: left; font-family: "Times New Roman", "Liberation Serif", serif; font-size: 25px; color: #fff;}

.box {position: relative; top: 0px; left: 45px; width: 708px; height: 408px; float: left; border: 1px solid #fff; margin-top: 45px;}

.site {position: relative; top: 0px; left: 0px; width: 708px; height: auto; float: left; margin-top: 152px; text-align: center;}

.sitecontent {position: relative; top: 0px; left: 0px; height: auto; width: auto; margin: auto; display: table; display: inline-block; text-align: left;}

.title {position: relative; top: 0px; left: 0px; width: 708px; height: auto; float: left; text-align: center;}

.titlecontent {position: relative; top: 0px; left: 0px; width: auto; height: auto; margin: auto; display: table; display: inline-block; text-align: left; word-spacing: 2px;}

a.sitelink:link {font-family: "Times New Roman", "Liberation Serif", serif; font-size: 48px; color: #000000; font-weight: normal; text-decoration: none; text-transform: uppercase; float: left;}

a.sitelink:visited {font-family: "Times New Roman", "Liberation Serif", serif; font-size: 48px; color: #000000; font-weight: normal; text-decoration: none; text-transform: uppercase; float: left;}

a.sitelink:hover {font-family: "Times New Roman", "Liberation Serif", serif; font-size: 48px; color: #cc0000; font-weight: normal; text-decoration: none; text-transform: uppercase; float: left;}

a.sitelink:active {font-family: "Times New Roman", "Liberation Serif", serif; font-size: 48px; color: #000000; font-weight: normal; text-decoration: none; text-transform: uppercase; float: left;}

a.titlelink:link {font-family: "Times New Roman", "Liberation Serif", serif; font-size: 28px; color: #fff; font-weight: normal; text-decoration: none; float: left;}

a.titlelink:visited {font-family: "Times New Roman", "Liberation Serif", serif; font-size: 28px; color: #fff; font-weight: normal; text-decoration: none; float: left;}

a.titlelink:hover {font-family: "Times New Roman", "Liberation Serif", serif; font-size: 28px; color: #cc0000; font-weight: normal; text-decoration: none; float: left;}

a.titlelink:active {font-family: "Times New Roman", "Liberation Serif", serif; font-size: 28px; color: #fff; font-weight: normal; text-decoration: none; float: left;}

/*---------------- element A content ----------------*/

JavaScript. Code:

var wresolution=screen.width;

var hresolution=screen.height;

function centering(){

if(wresolution>=1024 && hresolution>=768){

if(window.getComputedStyle){

var h=document.documentElement.clientHeight;

var w=document.documentElement.clientWidth;

var element_A = window.getComputedStyle(document.getElementById('element_A'), '');

var element_A_width=parseInt(element_A.getPropertyValue('width'));

var element_A_height=parseInt(element_A.getPropertyValue('height'));

document.getElementById('element_A').style.left=(w-element_A_width)/2+'px';

document.getElementById('element_A').style.top=(h-element_A_height)/2+'px';

}

else{

var h2=document.documentElement.clientHeight;

var w2=document.documentElement.clientWidth;

var element_A=document.getElementById('element_A');

var element_A_width=parseInt(element_A.currentStyle.width);

var element_A_height=parseInt(element_A.currentStyle.height);

document.getElementById('element_A').style.left=(w2-element_A_width)/2+'px';

document.getElementById('element_A').style.top=(h2-element_A_height)/2+'px';

};

window.onresize=centering;

};

};

JavaScript + CSS horizontal and vertical centering

There is no point in using this method in easy cases, when just an element's static positioning is necessary. It can be done, but it is easier and more reliable to achieve it by CSS centering. But when horizontal and vertical centering is required to start working only under some conditions or after some actions, then the horizontal and vertical centering by means of JavaScript and CSS becomes essential. VBscript or Java can be used instead of JavaScript, but JavaScript and its variation, JScript, work across a wider range of platforms and software, than VBscript; and simpler to implement than a method with Java.

There may be a variety of reasons and methods in using of JavaScript + CSS horizontal and vertical centering, but their essence all comes down to finding conditions, user's web browser and display device capabilities, running of scripts based on information obtained, if a specified condition is detected or a specified action is performed. A script can work directly with an element's CSS properties or to command what external style sheets file is to be used, which will assign new CSS properties for the element. Since case when a horizontal and vertical centering script selects which external style sheets file to use requires certain extra HTML and CSS preparations, it is not discussed here - as a less pure and apparent example of using JavaScript for objects positioning handling by direct CSS properties manipulation.

The simplest case is considered, to demonstrate the very possibility and its principle - dynamic change of an element's position in a browser's viewable area.

The first case

Condition: if screen resolution is equal to or greater than 1024 by 768 pixels, then center the page content horizontally and vertically:

An element A with dimensions declared explicitly is created. A screen resolution is specified - its arbitrary value will be the condition under which a script is to be run, for instance - 1024x768. In case the script finds screen resolution to be equal to or greater than 1024 by 768 pixels, then the rest of the function in the script is started, it determines the measurements (CSS properties assigned in external style sheets) of element A, the width and height of the browser viewable area. Using the numbers obtained, the distance between the left and top edge of the web browser viewable area and the left and top edge of the element A required for centering is calculated. In terms of CSS, it is when the CSS property "left" of the element A is equal to half difference between the width of the web browser viewable area and the width of the element A, and the CSS property "top" of the element A is equal to half difference between the height of the web browser viewable area and the height of the element A.

Since user can resize the web browser window after the page is loaded, the web browser window size is monitored. Each time it is changed, the function centering element A horizontally and vertically is run anew and element A is centered horizontally and vertically again, at the new dimensions of the web browser viewable area.

The second case

Condition: if screen resolution is equal to or greater than 1024 by 768 pixels and if mouse cursor is moved over a link in element A, then center the page content horizontally and vertically:

An element A with dimensions declared explicitly is created. A link with onMouseOver event handler and with appropriate script is created in the element A. Screen resolution is detected - a specified value of it will be the condition under which the script is to be triggered, for instance - 1024x768. When mouse cursor is moved over the link, if screen resolution is equal to or greater than 1024 by 768 pixels, the script is run to determine the measurements (CSS properties assigned in external style sheets) of element A, the width and height of the web browser viewable area. Using the numbers obtained, the distance between the left and top edge of the web browser viewable area and the left and top edge of the element A required for centering is calculated. In terms of CSS, it is when the CSS property "left" of the element A is equal to half difference between the width of the web browser viewable area and the width of the element A, and the CSS property "top" of the element A is equal to half difference between the height of the web browser viewable area and the height of the element A.

Since user can resize the web browser window after the page is loaded, the web browser window size is monitored. Each time it is changed, the function centering element A horizontally and vertically is run anew and element A is centered horizontally and vertically again, at the new dimensions of the web browser viewable area.


[ 1 ]

All in all, it works starting Opera 7.5 as well, but with a shift by a number of pixels.

[ 2 ]

All in all, it works starting Opera 7.5 as well, but with a shift by a number of pixels.


Aliosque subditos et thema

 

Network setup in DOS. Microsoft Network Client 3.0

 

In order to install Microsoft Network Client 3.0 and set up network in DOS, there have to be several programs at hand: 1. Microsoft Network Client 3.0 [ Download ] 2. NDIS 2.0 driver for Ethernet network card. For example: Realtek RTL8029AS [ Download ]. Drivers for other network cards may be found, for instance, on web sites of Ethernet cards manufacturers. 3. If it is not MS-DOS 6.0+ to be used, QEMM97 [ Download ] Installing Microsoft Network Client 3.0 and setting up network in DOS, step by step: 1. Create a folder, for example C:\DRIVERS\. Put there: a NDIS 2.0 driver for Ethernet network card. 2. Prepare installation floppies of Microsoft Network Client 3.0: DSK3-1.EXE -d A: DSK3-2.EXE -d A: 3. Start setup.exe from the first floppy and begin Microsoft Network Client 3.0 installation. Installation is starting. Press Enter to continue Select folder for Microsoft Network Client 3.0 to be installed to. It may be any or the suggestion of the installer may be left as it is - in the case discussed it is left as it is. Enter Microsoft Network Client 3.0 installer examining the system files Select driver for Ethernet network card. If there is no right driver on the list, choose "*Network adapter not shown on list below ..." Enter This dialogue appears if there was no right driver on the proposed list of Ethernet network card drivers and "*Network adapter not shown on list below ..." has been selected. Specify the path to the folder containing the appropriate driver for the Ethernet network card. In the case discussed it is C:\DRIVERS\, typing it in. Enter Select driver from C:\DRIVERS\ folder specified in the previous step. In the case discussed it is RTL8029AS PCI Ethernet Adapter. Enter Choose to let or not to let Microsoft Network Client 3.0 use more RAM in its work to get the best performance. Any of the two choices is acceptable. For example - let it to. Enter Enter user name of up to 20 characters. It can contain Latin letters, numbers and characters listed. In the case discussed it is "net".

Non-breaking space ( &nbsp; ) in :before and :after content

 

Non-breaking space ( &nbsp; ) in :before and :after pseudo-elements. Hex code ( \00a0 ) is used in the content property instead of the named character entity ( &nbsp; ). Example: ABC HTML / XHTML. Code: <div>ABC</div> CSS. Code: div:before {content:"\00a0";} div:after {content:"\00a0";} /* Extra CSS to make non-breaking spaces more obvious here: */ div:before {height: 1em; width: 1em; display: inline-block; background: #f00;} div:after {height: 1em; width: 1em; display: inline-block; background: #00f;} [ 1 ] As well as Netscape 6.01+, Mozilla 0.6+. [ 2 ] As well as Netscape 6.01+, Mozilla 0.6+.