Brak rekacji na margin-right/left:auto;

pytanie zadane 18 lipca 2018 w HTML i CSS przez kubusop Początkujący (420 p.)
zamknięte 19 lipca 2018 przez kubusop

Nie działa mi wyśrodkowanie diva. Znalazłem informacje, że div musi mieć określoną wielkość więc określiłem ,ale nadal nie dziła.

HTML:

<body>
	<header>
		<div class="logo_container">
		<div class="logo">
			<div class="logo_img"><img src="img/logo.png"></div>
			<div class="logo_name">Nazwa</div>
			<div style="clear:both;"></div>
		</div>
		</div>
	</header>
</body>

CSS:

body
{
	background-color:#efefef;
	margin:0;
}

.logo_container
{
	margin-top:40px;
	width:100%;
}

.logo
{
	margin-left:auto;
	margin-right:auto;
}

.logo_img img
{
	float:left;
	width:150px;
	height:80px;
}

.logo_name
{
	text-transform:uppercase;
	font-size:30px;
}

komentarz zamknięcia: Problem rozwiązany

2 odpowiedzi

odpowiedź 18 lipca 2018 przez goramarcin Użytkownik (740 p.)

odpowiedź 18 lipca 2018 przez Jake Obywatel (1,820 p.)

Po 1 coś całkiem ten css u mnie nie działał i musiałem przepisać ale mniejsza. Musisz ustalić width dla elementu który ma być wyrównany (ma margin-left:auto; margin-right:auto;) np coś takiego:

body {
    background-color: #efefef;
    margin: 0;
    padding: 0;
}
.logo_container {}
.logo {
    width: 300px;
    margin-left: auto;
    margin-right: auto;
    margin-top: 40px;
}
.logo_img img {
    float: left;
    width:150px;
    height:80px;
}
.logo_name {
    float: right;
    text-transform: uppercase;
    font-size: 30px;
}

komentarz 18 lipca 2018 przez kubusop Początkujący (420 p.)

Więc jak określę dokładną szerokość napisu jeśli chcę idealnie dopasować diva do zdjęcia i nazwy.

1	komentarz 19 lipca 2018 przez Jake Obywatel (1,820 p.) Więc jeśli nie znasz wymiarów najlepiej będzie użyć tu position:absolute; left:auto; right:auto; dla .logo