Rounded Corner box using CSS with Nifty not Working, help me
-
16-09-2019 - |
Question
Im trying to put a rounded rectangle using Nifty technique. But not working help me. My Code is Below
st.html
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>
<script type="text/javascript" src="nifty.js"></script>
<link href="niftyCorners.css" rel="stylesheet" type="text/css" />
<link href="niftyPrint.css" rel="stylesheet" type="text/css" />
<link href="stm.css" rel="stylesheet" type="text/css" />
<script type="text/javascript">
window.onload=function(){
if(!NiftyCheck())
return;
Rounded("div.indian","#377CB1","#9BD1FA");
}
</script>
</head>
<body>
<div class="indian">
<p>I am an Indian</p>
</body>
</html>
stm.css
@charset "utf-8";
/* CSS Document */
.indian
{
height:300px;
width:300px;
font-family:Georgia, "Times New Roman", Times, serif;
font-size:18px;
}
Help me
Solution
- Your <div class="indian"> is not closed. This is probably keeping the Javascript from finding the <div> in the DOM.
- You need to set the "media" for your print stylesheet. The print stylesheet hides all of the work that the Nifty JS does.
- You are not setting background colors for the page or the "indian" <div>. Without doing this, the effect will not work correctly.
- I don't think that setting the height of the "indian" <div> is supported when using the Nifty technique.
Correcting these errors, your code works as seen here: http://demo.raleighbuckner.com/so/1277789/
Also, you should probably use the newer version of the Nifty technique found here: http://www.html.it/articoli/niftycube/index.html
OTHER TIPS
Your HTML is incorrect. You are missing a closing DIV:
<body>
<div class="indian">
<p>I am an Indian</p>
</div> <!-- This was missing -->
</body>
Also, you're using the old version of Nifty. Try the newer version: http://www.html.it/articoli/niftycube/index.html
Licensed under: CC-BY-SA with attribution
Not affiliated with StackOverflow