raja

i have already removed the tables and updated the live demo page. i have 3 problems. the text at the box is not centered.Please see the image-1. i added class to the big text at the main content.But its not taking efect as per my css . And the sign up button is displaced from its div please see the image 3.Am a novice in css Image-1 Image-2 Image-3

Any help please?

nice one tks a lot

cs4 is having lots of improved options. They named it as auto vector mask

can u show us the png or live demo please?

i think u must be a beta testing member to have a fully functioning beta version.

try lynda.com cds they can help u a lot http://lynda.com

i don used frames. i used co.nr to shorten my url.Ok i edited the post and now i post the actual url please see it now. Regards Raja

hi frnds am raja from India am a student and an amateur web and graphic designer. And i really thrilled to be part of this forum. Thanks a lot Regards Raja

Hi Friends i made this web Template using photoshop cs3 and i just started coding it pure css . Am a novice at css and i eneded up some thing like this (Please see the Live demo page) I also added the entire css along with the Html.Also added all the sliced images and html fles.please some one help me fix the css problems please.Thanks in advance. Regards Raja This is the actual template i made using photoshop. This is the Live Demo page: http://rajaportfolio.freehostia.com/mafic/new.htm This is the css : #logo{ background-image: url(images/logo.png); background-repeat: no-repeat; height: 71px; width: 900px; } #navbar{ font-family: Tahoma, Arial; background-image: url(images/navbar.png); background-repeat: no-repeat; height: 39px; width: 900px; font-size: 14px; color: #838383; text-decoration: none; padding: 0px; text-align: left; margin: 0px; } #header{ background-image: url(images/header.png); background-repeat: no-repeat; height: 151px; width: 900px; } #maincontent{ width: 900px; background-color: #FFFFFF; } #footer{ background-image: url(images/footer.png); background-repeat: no-repeat; height: 41px; width: 900px; } #wrapper{ width: 900px; margin-top: 0px; margin-right: auto; margin-bottom: 0px; margin-left: auto; } #shadow{ background-image: url(images/mainshadow.png); float: left; height: 74px; width: 618px; } #reach{ background-image: url(images/reach.png); background-repeat: no-repeat; float: left; height: 139px; width: 282px; } #middlecontent{ height: 275px; width: 900px; } #leftbox{ height: 275px; width: 302px; float: left; } #mddlebox{ height: 275px; width: 297px; float: left; } #rightbox{ float: left; height: 275px; width: 301px; } html,body{ background-position: 0px 0px; background-image: url(images/background.png); background-repeat: repeat; } .clearthis{ clear: both; } #maincontentleft{ float: left; width: 618px; } #maincontentright{ width: 282px; float: left; } #box1header{ background-image: url(images/box1header.png); height: 50px; width: 302px; background-repeat: no-repeat; } #box1image{ background-image: url(images/box1image.png); background-repeat: no-repeat; height: 89px; width: 302px; } #box1left{ background-image: url(images/box1left.png); background-repeat: no-repeat; height: 104px; width: 36px; float: left; } #box1right{ background-image: url(images/box1right.png); background-repeat: no-repeat; height: 104px; width: 30px; float: left; } #box1main{ background-image: url(images/box1main.png); background-repeat: no-repeat; height: 104px; width: 236px; float: left; } #box1bottom{ background-image: url(images/box1footer.png); background-repeat: no-repeat; height: 32px; width: 302px; float: left; } #box2header{ background-image: url(images/box2header.png); background-repeat: no-repeat; height: 50px; width: 297px; } #box2image{ background-image: url(images/box2image.png); background-repeat: no-repeat; height: 89px; width: 297px; } #box2left{ background-image: url(images/box2left.png); background-repeat: no-repeat; height: 104px; width: 28px; float: left; } #box2right{ background-image: url(images/box2right.png); background-repeat: no-repeat; height: 104px; width: 31px; float: left; } #box2main{ background-image: url(images/box2main.png); background-repeat: no-repeat; height: 104px; width: 238px; float: left; } #box2bottom{ background-image: url(images/box2footer.png); background-repeat: no-repeat; height: 32px; width: 297px; clear: left; } #box3header{ background-image: url(images/box3header.png); background-repeat: no-repeat; height: 50px; width: 301px; } #box3image{ background-image: url(images/box3image.png); background-repeat: no-repeat; height: 89px; width: 301px; } #box3main{ background-image: url(images/box3main.png); background-repeat: no-repeat; height: 72px; width: 244px; float: left; } #box3lftres{ background-image: url(images/box3leftresidue.png); background-repeat: no-repeat; height: 32px; width: 67px; float: left; } #box3rhtres{ background-image: url(images/box3rhtresidue.png); background-repeat: no-repeat; height: 32px; width: 51px; float: left; } #box3sign{ float: left; height: 32px; width: 126px; } #box3bottom{ background-image: url(images/box3footer.png); background-repeat: no-repeat; clear: right; height: 32px; width: 301px; } #box3lft{ background-image: url(images/box3left.png); background-repeat: no-repeat; height: 104px; width: 22px; float: left; } #box3rht{ background-image: url(images/box3right.png); background-repeat: no-repeat; height: 104px; width: 35px; float: left; } #navbar a:link { font-family: Tahoma, Arial; font-size: 14px; color: #838383; text-decoration: none; } #navbar a:visited { font-family: Tahoma, Arial; font-size: 14px; color: #666666; text-decoration: none; } #navbar a:hover { font-family: Tahoma, Arial; font-size: 14px; color: #FFFFFF; text-decoration: underline; } a:active { font-family: Tahoma, Arial; font-size: 14px; color: #FF9900; text-decoration: none; } .navbartext{ font-family: Tahoma, Arial; font-size: 14px; color: #838383; text-align: left; vertical-align: middle; margin: 0px; padding-top: 10px; padding-right: 0px; padding-bottom: 0px; padding-left: 10px; } .boxheadertext{ font-family: Tahoma, Arial; font-size: 15px; color: #FFFFFF; text-align: center; vertical-align: middle; margin: 0px; text-decoration: none; padding-top: 0px; padding-right: 0px; padding-bottom: 0px; padding-left: 0px; } .boxtext{ font-family: Arial, Helvetica, sans-serif; font-size: 12px; color: #000000; text-decoration: none; margin: 0px; padding: 0px; } #lnks{ background-image: url(images/side.jpg); background-repeat: repeat-y; width: 282px; float: left; } #maincontent1{ background-color: #FFFFFF; width: 618px; float: left; height: 400px; } .lnkstext{ font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 12px; font-weight: bold; color: #000000; padding-left: 5px; } .big_txt { font-family: Georgia, Arial, Helvetica, sans-serif; font-size: 22px; color: #933d18; padding-bottom:5px; } .small_txt{ font-family: Arial, Helvetica, sans-serif; font-size: 12px; color: #000000; } .footertext{ font-family: Tahoma, Arial; font-size: 12px; color: #838383; padding-top: 5px; padding-left: 8px; margin: 0px; } .footertext a:link { font-family: Tahoma, Arial; font-size: 12px; color: #838383; text-decoration: none; } .footertext a:visited { font-family: Tahoma, Arial; font-size: 12px; color: #838383; text-decoration: none; font-weight: bold; } .footertext a:hover { font-family: Tahoma, Arial; font-size: 12px; color: #FFFFFF; text-decoration: underline; } .footertext a:active { font-family: Tahoma, Arial; font-size: 12px; color: #FFFFFF; text-decoration: none; } This is the 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> <link href="raja.css" rel="stylesheet" type="text/css" /> </head> <body> <div id="wrapper"> <div id="logo"></div> <div id="navbar"> <div align="center" class="navbartext"><a href="#">Home </a> <a href="#">Button1</a> <a href="#">Button2</a> <a href="#">Button3</a> <a href="#">Button4</a> <a href="#">Button5</a> <a href="#">Button6</a> </div> </div> <div id="header"></div> <div id="middlecontent"> <div id="leftbox"> <div class="boxheadertext" id="box1header">Yout Text</div> <div id="box1image"></div> <div id="box1left"></div> <div class="boxtext" id="box1main">Add some text here.. Add some Text Here.Add some Text here.Add some Text here.</div> <div id="box1right"></div> <div id="box1bottom"></div> </div> <div id="mddlebox"> <div class="boxheadertext" id="box2header">Your Text</div> <div id="box2image"></div> <div id="box2left"></div> <div id="box2main"><span class="boxtext">Add some text here.. Add some Text Here.Add some Text here.Add some Text here.</span></div> <div id="box2right"></div> <div id="box2bottom"></div> </div> <div id="rightbox"> <div class="boxheadertext" id="box3header">Your Text</div> <div id="box3image"></div> <div id="box3lft"></div> <div id="box3main"><span class="boxtext">Add some text here.. Add some Text Here.Add some Text here.Add some Text here.</span></div> <div id="box3rht"></div> <div id="box3lftres"></div> <div id="box3sign"><img src="images/signupbtn.png" alt="Sign Up Now!!" border="0" usemap="#Map" /> <map name="Map" id="Map"><area shape="rect" coords="12,7,118,27" href="#sign up" /> </map></div> <div id="box3rhtres"></div> <div id="box3bottom"></div> </div> </div> <div id="maincontent"> <div id="maincontentleft"> <div id="shadow"></div> <div class="big_txt" id="maincontent1">Add a Big Text here</div> </div> <div id="maincontentright"> <div id="reach"></div> </div> <div id="lnks"><table width="282" border="0"> <tr> <td width="23" height="23"><img src="images/dot.jpg" width="23" height="23" /></td> <td class="lnkstext">Link1</td> </tr> <tr> <td width="23" height="23"><img src="images/dot.jpg" width="23" height="23" /></td> <td class="lnkstext">Link2</td> </tr> <tr> <td width="23" height="23"><img src="images/dot.jpg" width="23" height="23" /></td> <td class="lnkstext">Link3</td> </tr> <tr> <td width="23" height="23"><img src="images/dot.jpg" width="23" height="23" /></td> <td class="lnkstext">Link4</td> </tr> <tr> <td width="23" height="23"><img src="images/dot.jpg" width="23" height="23" /></td> <td class="lnkstext">Link5</td> </tr> <tr> <td width="23" height="23"><img src="images/dot.jpg" width="23" height="23" /></td> <td class="lnkstext">Link6</td> </tr> <tr> <td width="23" height="23"><img src="images/dot.jpg" width="23" height="23" /></td> <td class="lnkstext">Link7</td> </tr> <tr> <td width="23" height="23"> </td> <td> </td> </tr> <tr> <td width="23" height="23"> </td> <td> </td> </tr> <tr> <td width="23" height="23"> </td> <td> </td> </tr> <tr> <td width="23" height="23"> </td> <td> </td> </tr> <tr> <td width="23" height="23"> </td> <td> </td> </tr> <tr> <td width="23" height="23"> </td> <td> </td> </tr> <tr> <td width="23" height="23"> </td> <td> </td> </tr> <tr> <td width="23" height="23"> </td> <td> </td> </tr> <tr> <td width="23" height="23"> </td> <td> </td> </tr> <tr> <td width="23" height="23"> </td> <td> </td> </tr> <tr> <td width="23" height="23"> </td> <td> </td> </tr> <tr> <td width="23" height="23"> </td> <td> </td> </tr> <tr> <td width="23" height="23"> </td> <td> </td> </tr> </table> </div> </div> <div class="clearthis"></div> <div class="footertext" id="footer"><a href="#">Home</a> <a href="#">Pacjages</a> <a href="#">Pricing</a> <a href="#">Advertisers</a> <a href="#">Free SEO</a> <a href="#">Tools</a> <a href="#">Resellers</a> <a href="#">Publishers</a> <a href="#">FAQ</a> </div> </div> </body> </html> This is the sliced Images and the Html Files Uploaded to Mediafire : http://www.mediafire.com/?ndptlut2mzf