2015-04-15 4 views
1

Я разрабатываю свою веб-страницу, и я следовал этому учебнику «https://www.youtube.com/watch?v=1tdRozm__K0». Единственное, что я пытаюсь изменить, - это центрирование текста. И я не смог понять это правильно. Это было близко, но мой OCD просто не позволит этого. Помощь очень ценится.Устранение неисправностей

Благодаря

body { 
 
\t width: 100%; 
 
\t margin: auto; 
 
\t font-family: Helvetica; 
 
} 
 

 
.header { 
 
\t background: #383838; 
 
\t width: 100%; 
 
\t top: 0; 
 
\t position: fixed; 
 
} 
 

 
.container { 
 
\t width: 960px; 
 
\t margin: 0 auto; 
 
} 
 

 
.logo { 
 
\t float: center; 
 
\t font-size: 15; 
 
\t color: white; 
 
}
<DOCTYPE html> 
 
<html> 
 
\t <head> 
 
\t \t <title>Website</title> 
 
\t \t <link rel="stylesheet" href="style.css" type="text/css" /> 
 
\t </head> 
 
\t 
 
\t <body> 
 
\t \t <!-- IGNORE THIS! THIS IS FOR LiveReload --> 
 
\t \t <script>document.write('<script src="http://' + (location.host || 'localhost').split(':')[0] + ':35729/livereload.js?snipver=1"></' + 'script>')</script> 
 
\t \t <!-- IGNORE THIS! THIS IS FOR LiveReload --> 
 
\t \t 
 
\t \t <div class="header"> 
 
\t \t \t 
 
\t \t \t <div class="container"> 
 
\t \t \t \t 
 
\t \t \t \t <div class="logo"> 
 
\t \t \t \t \t <h1>WEBSITE</h1> 
 
\t \t \t \t </div> 
 
\t \t \t 
 
\t \t \t </div> 
 
\t \t 
 
\t \t </div> 
 
\t </body> 
 
</html>

ответ

1

Вы фиксированную ширину контейнера, просто удалите его и дать text-align:center к .logo.

Проверьте это:

body { 
 
\t width: 100%; 
 
\t margin: auto; 
 
\t font-family: Helvetica; 
 
} 
 

 
.header { 
 
\t background: #383838; 
 
\t width: 100%; 
 
\t top: 0; 
 
\t position: fixed; 
 
} 
 

 
.container { 
 
\t margin: 0 auto; 
 
} 
 

 
.logo { 
 
\t float: center; 
 
\t font-size: 15; 
 
\t color: white; 
 
    text-align:center; // Here align center make text center. 
 
}
<DOCTYPE html> 
 
<html> 
 
\t <head> 
 
\t \t <title>Website</title> 
 
\t \t <link rel="stylesheet" href="style.css" type="text/css" /> 
 
\t </head> 
 
\t 
 
\t <body> 
 
\t \t <!-- IGNORE THIS! THIS IS FOR LiveReload --> 
 
\t \t 
 
\t \t <!-- IGNORE THIS! THIS IS FOR LiveReload --> 
 
\t \t 
 
\t \t <div class="header"> 
 
\t \t \t 
 
\t \t \t <div class="container"> 
 
\t \t \t \t 
 
\t \t \t \t <div class="logo"> 
 
\t \t \t \t \t <h1>WEBSITE</h1> 
 
\t \t \t \t </div> 
 
\t \t \t 
 
\t \t \t </div> 
 
\t \t 
 
\t \t </div> 
 
\t </body> 
 
</html>

+0

Спасибо! Я попробую :) – tristianchase

+0

Он сделал! Как я могу отметить как правильно? Извините, что я только что присоединился сегодня вечером. – tristianchase

+1

Я буду, Он говорит, что мне нужно подождать 2 минуты. – tristianchase

Смежные вопросы