Css Course

Egg shape created with a DIV tag and a few CSS properties (without image file).
Code:
<style type="text/css">
/* http://css-tricks.com/examples/ShapesOfCSS/ */
#egg {
 display:block;
 width: 180px;
 height: 240px;
 background-color: #09fb09;
 -webkit-border-radius: 63px 63px 63px 63px / 108px 108px 72px 72px;
 border-radius: 50% 50% 50% 50% / 60% 60% 40% 40%;
}

/* Content in egg */
#eggsp div {
 position:absolute;
 padding:89px 2px 2px 9px;
}
</style>

<div id="egg"><div>CSS Course<br/>https://CoursesWeb.net</div></div></div>
Demo:
CSS Course
https://CoursesWeb.net

Daily Test with Code Example

HTML
CSS
JavaScript
PHP-MySQL
What attribute makes a radio button or checkbox input selected?
checked="checked" selected="selected" disabled="disabled"
<input type="checkbox" name="a_name" value="value" checked="checked" />
What CSS value scales the background image to the largest size contained within the element?
repeat-x contain linear-gradient
#id {
  background:url("path_to_image.png");
  background-size:contain;
  background-repeat:no-repeat;
}
What operator is used to determine the rest of the division of two numbers?
% * /
var rest8_7 = 8 % 7;
alert(rest8_7);
Indicate the PHP function that rounds a number up to the next highest integer.
floor() ceil() abs()
$nr = ceil(3.5);
echo $nr;        // 4
Egg shape with CSS

Last accessed pages

  1. sPBM - Simple PHP Backup Manager (3390)
  2. querySelector and querySelectorAll (30115)
  3. CSS3 2D transforms (820)
  4. How to get JSON data from JavaScript to PHP (617)
  5. Add /Delete rows in HTML table with JavaScript (4298)

Popular pages this month

  1. Courses Web: PHP-MySQL JavaScript Node.js Ajax HTML CSS (55)
  2. The Mastery of Love (9)
  3. CSS cursor property - Custom Cursors (9)
  4. CSS3 2D transforms (7)
  5. Read Excel file data in PHP - PhpExcelReader (7)