Using CSS file with custom font?

0 favourites
  • 9 posts
From the Asset Store
Creepy Sprite Font suitable font for your Dark/Horror/Halloween games.
  • can someone tell me how I can fix this .css file

    #MYCSS{
    	@font-face {
    		font-family: 'phaser_bankregular';
    		src: url('phaserbank.eot');
    		src: url('phaserbank.eot?#iefix') format('embedded-opentype'),
    			 url('phaserbank.woff2') format('woff2'),
    			 url('phaserbank.woff') format('woff'),
    			 url('phaserbank.ttf') format('truetype'),
    			 url('phaserbank.svg#phaser_bankregular') format('svg');
    		font-weight: normal;
    		font-style: normal;
    	}
    	color: #4CFF00 !important;
    	font-size: 16px;
    	padding: 8px 32px;
    	border: 2px solid #4CFF00;
    	background: #000000;
    	background: linear-gradient(top,  #000000,  #000000);
    	background: -ms-linear-gradient(top,  #000000,  #000000);
    	background: -webkit-gradient(linear, left top, left bottom, from(#000000), to(#000000));
    	background: -moz-linear-gradient(top,  #000000,  #000000);
    }
    #MYCSS:hover{
    	color: #FFFFFF !important;
    	background: #000000;
    	background: linear-gradient(top,  #000000,  #000000);
    	background: -ms-linear-gradient(top,  #000000,  #000000);
    	background: -webkit-gradient(linear, left top, left bottom, from(#000000), to(#000000));
    	background: -moz-linear-gradient(top,  #000000,  #000000);
    }
    [/code:1gyc9sus]
    
    I am using a custom font but it doesn't seem to work
  • Edited

    I fixed the custom font and the outline problem but..

    I seem to not be able to make the button be affected by any padding change

    also I can't seem to shrink the box at all without offsetting its position

    I used

    @font-face {
    	font-family: 'phaser_bankregular';
    	src: url('phaserbank.eot');
    	src: url('phaserbank.eot?#iefix') format('embedded-opentype'),
    		 url('phaserbank.woff2') format('woff2'),
    		 url('phaserbank.woff') format('woff'),
    		 url('phaserbank.ttf') format('truetype'),
    		 url('phaserbank.svg#phaser_bankregular') format('svg');
    	font-weight: normal;
    	font-style: normal;
    }
    
    #MYCSS{
        	font-family: 'phaser_bankregular';
    	outline:none;
    	color: #4CFF00 !important;
    	font-size: 16px;
    	padding: 0px 0px;
    	border: 2px solid #4CFF00;
    	background: #000000;
    	background: linear-gradient(top,  #000000,  #000000);
    	background: -ms-linear-gradient(top,  #000000,  #000000);
    	background: -webkit-gradient(linear, left top, left bottom, from(#000000), to(#000000));
    	background: -moz-linear-gradient(top,  #000000,  #000000);
    }
    #MYCSS:active{
        	font-family: 'phaser_bankregular';
    	outline:none;
    	color: #4CFF00 !important;
    	font-size: 16px;
    	padding: 10px 10px;
    	border: 2px solid #4CFF00;
    	background: #000000;
    	background: linear-gradient(top,  #000000,  #000000);
    	background: -ms-linear-gradient(top,  #000000,  #000000);
    	background: -webkit-gradient(linear, left top, left bottom, from(#000000), to(#000000));
    	background: -moz-linear-gradient(top,  #000000,  #000000);
    }
    
    }[/code:2yl19xnu]
  • I guess #MYCSS is the ID of your button ?

    Try to put display: inline-block or display: block in your css.

    Also no need to write twice your padding values as they are identical.

    padding: 10px 10px is the same as padding: 10px.

  • nope it still seems to only change the padding's bottom and right

    I am going for a shrink of all four sides when you click

  • bump

    more problems

    scrolling bars seems to have graphical problems with css

    dropdownlist's actual dropdown bar's borders can't be customized

  • Try Construct 3

    Develop games in your browser. Powerful, performant & highly capable.

    Try Now Construct 3 users don't see these ads
  • Can you provide a link to your .capx file ?

  • I can make a example .capx

    Here

    Basically the stuff isn't being effected by the css all the way

    some of it seems to still be white

  • le Canapin

    you there I posted the capx example

  • Can you provide a link to your .capx file ?

    I did you still haven't replied

Jump to:
Active Users
There are 1 visitors browsing this topic (0 users and 1 guests)