Brackets UTF-8

[Poligno 1]

Olá galera,voltei a estudar HTML/CSS e decidi baixar o bracktes, que eu costuma usar, pois acho o notepad++ MUITO RUIM, só que acusou o seguinte erro quando fui tentar abrir o arquivo .css : http://prntscr.com/b3xc6k

 

Diz que atualmente o bracktes da suporte apenas para códigos com o UTF-8,só que o css que estou tentando abrir tem o UFT-8,segue o código a baixo:

 

 

@charset "UTF-8";

body{
background-color:white;
color:blue;
}
/* --------------------------------------------------------| DIV INTERFACE |--------------------------------------------------------------*/
div#interface{
width:70%;
margin:10px 10px 10px 10px;
position:absolute;
border:2px solid yellow;
background-color:green;

}

div#interface hgroup{
margin-top:90px;
}

div#interface h1{
color:red;
left:350px;
position:relative;
}

p{
color:green;
text-indent:50px;
}

figure.teucu h1#sotroxa {
left:-70px;

}

figure.teucu {
border:18px solid white ;
box-shadow:1px 1px 4px black; /*Define o sombreado das bordas*/
position:relative;
}

figure.teucu img{
width:100%;
height:100%;
}

figure.teucu figcaption{
position:absolute;
top:0px;
font-size:40px;
color:white;
background-color:rgba(10,0,0,.6);
width:100%;
height:100%;
box-sizing: border-box; /*define a borda como limite*/
opacity:0; /*define a opacidade como 0,deixando a caixa 100% trasnparente*/
transition:opacity 1s; /*Define o tempo da transição,nesse caso da opacidade*/
transition:color 2s; /*Define o tempo da transição,nesse caso da cor*/
}

figure.teucu figcaption h1{
margin-left:165px;

}

figure.teucu:hover figcaption{ /*hover define os atributos do item qnd O CURSOR DO MOUSE FOR PASSADO POR CIMA DESTE ITEM*/
opacity:1;
color:red;
}


/* --------------------------------------| ESTILIZAÇÃO DO MENU | -------------------------------------- */


nav#menu ol{
list-style:none; /* Oculta os numeradores da lista//ou as bolinhas caso estaja usando uma lista 'ul'*/
text-transform:uppercase; /* Define deixa tds as letras maiuscolas*/
top:-6px;
left:115px;
position:absolute;
background-color:red;
height:3%;
border-radius:5px;
box-sizing: border-box;
}

nav#menu li{
display:inline; /*deixa os itens lado a lado*/
background-color:#00fcb4;
padding:10px;
margin:10px;
top:23px;
left:-23px;
transition:1s;
position:relative;
border:1px solid;
border-radius:5px;
}

nav#menu li:hover{
background-color:#000033;
}

nav#menu h1{
display:none;
}

nav#menu a{
text-decoration:none; /* Apaga os sublinhados */
}

 

Grato desde já!

[goodeathx 8]

@Poligno, a configuração no CSS é para quando for exibida. O arquivo que se está abrindo que necessita estar em UTF-8. Alguns editores como sublime text , fazem essa conversão de maneira bem simples.

[Poligno 1]

@Poligno, a configuração no CSS é para quando for exibida. O arquivo que se está abrindo que necessita estar em UTF-8. Alguns editores como sublime text , fazem essa conversão de maneira bem simples.

 

E como eu coloco o arquivo em UTF-8?

[goodeathx 8]

@Poligno, No sublime text 2, é só abrir o arquivo, ir em no menu "Arquivo/File" ir na opção "Reabrir arquivo com condificação/Reopen with enconding" e escolher UTF8 e salvar.

[Poligno 1]

@Poligno, No sublime text 2, é só abrir o arquivo, ir em no menu "Arquivo/File" ir na opção "Reabrir arquivo com condificação/Reopen with enconding" e escolher UTF8 e salvar.

 

Vou baixar o Sublime Text então,qualquer coisa volto aqui rsrs

 

Muito obrigado!

[Carlos Henrique A. 7]

@Poligno

Recomendo que use sublime text.

Vai gostar bastante!

[Maujor 144]

Se você tiver em ambiente Windows, não precisa baixar nada, use o Bloco de Notas.
Copie e cole o arquivo no Bloco de Notas e vá em Arquivo => Salvar como.
Na janela que abre na caixa de Codificação escolha UTF-8 (Por padrão esta caixa esté em codificação ANSI) e salve com o nome blablabla.css