Jump to content

tejasamrute

Members
  • Posts

    132
  • Joined

  • Last visited

Everything posted by tejasamrute

  1. tejasamrute

    Rule @face font

    @font-face { font-family: 'AEBL'; src: url('fonts/AEBL.eot'); src: url('fonts/AEBL.eot?#iefix') format('embedded-opentype'), url('fonts/AEBL.woff') format('woff'), url('fonts/AEBL.ttf') format('truetype'), }div {font-family: 'AEBL';} you need 3 types of font extension to make it work on all browsers (TTF, EOT, WOFF).....u only have ttf btw...i am not able to find AEBL font....are you sure it is not Abel font
  2. http://www.cssplay.co.uk/menu/imap.html http://www.tankedup-imaging.com/css_dev/rollover.html Try these
  3. tejasamrute

    Rule @face font

    well....we need to see your code before telling where are you going wrong and do you also have your desired font in eot,woff,ttf extension?
  4. http://www.sitepoint.com/highlight-image-map-area-hotspots-jquery/ check the source code of the map which suits you
  5. <form> <input type="text" placeholder="Search..." required> <input type="button" value="Search"></form> This a basic search bar.....inorder to enable searching you first have to decide which programming launguage you will use (PHP / .Net etc).
  6. Assuming that you site doesn't look good in mobile and large monitors.......it is because of the resolution they use Best way to solve it by making the site responsive which will fit all types of resolution http://www.w3schools.com/bootstrap/default.asp
  7. table td { text-align:right;}table td.left { text-align:left;}<table cellpadding="0" cellspacing="0" border="0"> <tr> <td class="left">This is the text on the left </td> <td>123.00</td> <td>45.00</td> <td>123.99</td> </tr> <tr> <td class="left">Another line</td> <td>1.50</td> <td>100.00 </td> <td>0.90</td> </tr> </table>
  8. There is a way p{ direction:rtl; text-align:justify;}<p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo ligula eget dolor. Aenean massa. ###### sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Donec quam felis, ultricies nec, pellentesque eu, pretium quis, sem. Nulla consequat massa quis enim. Donec pede justo, fringilla vel, aliquet nec, </p> http://www.w3schools.com/cssref/pr_text_direction.asp
  9. this is the most perfect solution <div class="row"> <div class="col-xs-12 col-md-4"> <div class="alert alert-info">A</div> </div> <div class="col-xs-12 col-md-4 col-md-push-4"> <div class="alert alert-danger">C</div> </div> <div class="col-xs-12 col-md-4 col-md-pull-4"> <div class="alert alert-warning">B</div> </div></div>
  10. well...yeah...duplicate content is ofcouse bad......but if the content is not much or if there is an image......the solution can be worth
  11. Adobe Dreamweaver.....you can make a website with clicks....dont evn hv to write the code* * Conditions Apply
  12. tejasamrute

    Crazy design

    This is a nice manipulated design....In this banner there are 3 layers above each other 1) Flat gray colour background which covers the whole screen...which u can see on upper side of the banner 2) House image which is rectangular and also covers whole screen 3) Gray shape which can be seen on lower side of the banner (change in colour with step 1) Jquery is applied to only Step 2 It is not that difficult unless you don't know what z-index is
  13. Make sure you attach your custom css file after bootstrap css or else you will have to use !important after every style
  14. @haris.....u can make a duplicate of C ( after B ) and place it after A.....and hide it for desktop version.....when the view port reaches mobile version.....make C ( after A ) visible .....and hide C ( after B ) <div class="row"><div class="col-md-8 col-sm-12">A</div><div class="col-md-8 col-sm-8 hidden-md hidden-lg visible-sm visible-xs">C</div><div class="col-md-4 col-sm-12">B</div><div class="col-md-12 hidden-xs hidden-sm visible-lg visible-md">C</div></div>
  15. .subBubble a{ display:block; width:100%; height:100%; padding-top:20px; /*As Desired*/ }
  16. span.paren span:hover { background: lightgray; } with this code...it will only highlight (and inner part) is this what are you looking for????
  17. you need to add another <td> after the left container <table style='border: 0; width: 100%; table-layout: fixed' id='blogTable' class='wsite-not-footer'> <tr> <td valign='top'> <div id='879090667725960140-blog' class='blog-body' style='float: left;'> Left Content are here </div> </td> <td valign='top'> <div> New Side Bar /* This is the New Sidebar which you want to add */ </div> </td> <td valign='top'> <td class='blog-sidebar' valign='top'> <div id='879090667725960140-sidebar' class='column-blog'><div class='blog-sidebar-separator'> Extreme Right Sidebar </div> </td> </tr></table> you will have to adjust widths of extreme left and extreme right container....in order to fit another sidebar
  18. @font-face { font-family: 'MyWebFont'; src: url('webfont.eot'); /* IE9 Compat Modes */ src: url('webfont.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */ url('webfont.woff2') format('woff2'), /* Super Modern Browsers */ url('webfont.woff') format('woff'), /* Pretty Modern Browsers */ url('webfont.ttf') format('truetype'), /* Safari, Android, iOS */} you will need eot,woff,woff2 with ttf to show the desired font in all browsers....you can easily convert ttf to other formats with http://www.everythingfonts.com
  19. i managed to solve the issue.....well it was stupid....somehow my respond.js was corrupt even though i downloaded from GitHub..'strange'
  20. you will have to use position:fixed; for the element you want to keep always at the top
  21. I have noticed that if i choose browser mode 8 with document mode 8...it shows perfectly.....but it has to be done manually......is there any way to force this....e.g if a visitor has come from ie8.....his browser mode and document mode would be forced to ie8
  22. i have attached images of my view in document mode 7 & 8
  23. Are you checking in browser mode or document mode?...in developer tools
  24. <!DOCTYPE HTML><html lang="en"><meta http-equiv="Content-Type" content="text/html; charset=utf-8" /><meta http-equiv="X-UA-Compatible" content="IE=edge"><meta name="viewport" content="width=device-width, initial-scale=1"> <link rel="stylesheet" href="bootstrap.min.css"> <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script> <script src="bootstrap.min.js"></script> <!--[if lt IE 9]> <script src="http://html5shiv.googlecode.com/svn/trunk/html5.js"></script> <script src="respond.min.js"></script> <![endif]--> <title>Untitled Document</title><style type="text/css">.container-fluid { background-color:pink;}</style></head><body><div class="container-fluid"> <h1>Hello World!</h1> <div class="row"> <div class="col-sm-4" style="background-color:lavender;">.col-sm-4</div> <div class="col-sm-4" style="background-color:lavenderblush;">.col-sm-4</div> <div class="col-sm-4" style="background-color:lavender;">.col-sm-4</div> </div></div></body></html>
×
×
  • Create New...