Css Course

Rhombus shape with DIV tag and CSS properties. The Rhombus shape is created by borders.
Code:
<style type="text/css">
#rhombus {
 position: relative;
 top: -60px;
 width: 0;
 height: 0;
 border: 60px solid transparent;
 border-bottom: 75px solid #05ed08;
}

/* Bottom area */
#rhombus:after {
 position: absolute;
 left: -60px;
 top: 75px;
 width: 0;
 height: 0;
 border: 60px solid transparent;
 border-top: 75px solid #05ed08;
 content: '';
}

/* Content in rhombus */
#rhombus div {
 position: relative;
 margin: 63px auto 0 -41px;
 font-weight: bold;
 z-index: 888;
}
</style>

<div id="rhombus"><div>CoursesWeb</div></div>
Demo:
CoursesWeb

Daily Test with Code Example

HTML
CSS
JavaScript
PHP-MySQL
Which tag is used to add definition lists into a <dl> element?
<dt> <dd> <li>
<dl>
 <dt>HTML</dt>
  <dd> - Hyper Text Markup Language</dd>
  <dd> - Language for web pages</dd>
</dl>
Which CSS property can hide an element on page, letting an empty space in its place?
display position visibility
#id {
  visibility: hidden;
}
Click on the event which is triggered when the mouse clicks on an object.
onclick onmouseover onfocus
document.getElementById("id").onclick = function(){
  alert("http://CoursesWeb.net/");
}
Indicate the PHP variable that contains the contents of both $_GET, $_POST, and $_COOKIE arrays.
$_SESSION $_GET $_REQUEST
if(isset($_REQUEST["id"])) {
  echo $_REQUEST["id"];
}
CSS Rhombus Shape

Last accessed pages

  1. Alert, Confirm and Prompt (4521)
  2. jsSHA - SHA Hashes and HMAC in JavaScript (3427)
  3. Download AJAX resources (219)
  4. Courses Web: PHP-MySQL JavaScript Node.js Ajax HTML CSS (137562)
  5. Recursive function to create Multi-Level Menu in PHP (11769)

Popular pages this month

  1. Courses Web: PHP-MySQL JavaScript Node.js Ajax HTML CSS (251)
  2. Read Excel file data in PHP - PhpExcelReader (91)
  3. PHP Unzipper - Extract Zip, Rar Archives (76)
  4. The Four Agreements (75)
  5. The Mastery of Love (66)