clear:both;

pytanie zadane 27 października 2016 w HTML i CSS przez Nevox Początkujący (290 p.)

Witam, mam pewien problem i zarazem parę pytań. Ale najpierw wkleję kod.

<!DOCTYPE HTML>
<html>
<head>

<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta name="Description" content="Tu podaj opis twojej strony" />
<meta name="Keywords" content="Tutaj wpisz słowa kluczowe" />
<meta http-equiv="Content-Language" content="pl" />
<meta name="Author" content="Tu wpisz swoje imię i nazwisko" />
    <link rel="stylesheet" href="style.css" type="text/css" />

<title>Strona oparta na divach</title>
</head>

<body>
 
    <div id="logo">Poznaj Linuxa !</div>
    <div id="belka"></div>
    <div style="clear:both;"></div>
   
</body>
</html>

I jeszcze css:

body
{
    background-color: aqua;
}

#logo
{
font-size: 48px;
color: white;
font-family: Verdana;
text-align: center;    
}

#logo:hover
{
color:indianred;    
cursor:pointer;
text-decoration:underline;
}

#belka
{
background-color: darkorange;
width: 700px;
height: 100px;  
float: left;
}

Po pierwsze nie działa mi div belka. To znaczy pojawia się ma określony kolor, ale mimo zastosowania float: left; i clear:both; ona jest pod divem logo a ja chciałbym, aby div belka była na divie logo. Czyli po prostu napis na takim prostokącie.

Po drugie, po zastosowaniu float: left; nie wiem jak mam wyśrodkować wtedy tekst. Próbuje text-align: center; ale to nie działa bo domyślam się że float to blokuje. To jak w takim razie to zrobić ?

Po trzecie w sumie podobne pytanie jak wyżej, lecz jak wyśrodkować nie tekst a dowolny element. Na przykład tą belkę. Próbowałem z margin left i right na auto ale nic to nie dało. Chciałbym żeby ktoś mi to wytłumaczył. Może ja źle rozumiem te dziedziczenie i nic mi nie wychodzi, sam nie wiem.

2 odpowiedzi

odpowiedź 27 października 2016 przez tirith Mądrala (5,940 p.)
wybrane 27 października 2016 przez Nevox

Najlepsza

1. Nie wiem czy dobrze zrozumiałem, ale jak chcesz aby napis poznaj linuksa był na tej belce to musisz DIVa logo umieścić wewnątrz diva BELKA. Wtedy float:left nie będzie potrzebny.

2 Text-align:center wyśrodkuje tekst wewnątrz np diva,

3. Jak chcesz użyć margin auto to belka nie moze mieć float left.

Sprawdz ten kod i zobacz czy taki coś chciałeś osiągnąć...

<!DOCTYPE HTML>
<html>
<head>
 
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta name="Description" content="Tu podaj opis twojej strony" />
<meta name="Keywords" content="Tutaj wpisz słowa kluczowe" />
<meta http-equiv="Content-Language" content="pl" />
<meta name="Author" content="Tu wpisz swoje imię i nazwisko" />
    <link rel="stylesheet" href="style.css" type="text/css" />
 
<title>Strona oparta na divach</title>
</head>
 
<body>
  
    <
    <div id="belka">
	
	<div id="logo">Poznaj Linuxa !</div>
	
	</div>
    <div style="clear:both;"></div>
    
</body>
</html>

komentarz 27 października 2016 przez Nevox Początkujący (290 p.)

Dziękuje bardzo :)

odpowiedź 27 października 2016 przez Nabu Użytkownik (790 p.)

<div id="belka"><div id="logo">Poznaj Linuxa !</div></div>
<div style="clear:both;"></div>

Spróbuj tak

komentarz 27 października 2016 przez xmentor Nałogowiec (49,520 p.)

<div style="clear:both;"></div>

Powstanie pusty, bezużyteczny element na stronie. Istnieją lepsze sposoby(:after).

komentarz 27 października 2016 przez Nevox Początkujący (290 p.)

Dziękuje, działa

Podobne pytania

0 głosów

1 odpowiedź 297 wizyt

Dlaczego poniżej divów z atrybutem float:left divy prawidłowo się układają mimo braku atrybutu clear:both?

pytanie zadane 14 sierpnia 2017 w HTML i CSS przez wawszczur Użytkownik (610 p.)

0 głosów

1 odpowiedź 227 wizyt

float: left; oraz both: clear; "footer" jest rozciągnięty

pytanie zadane 11 czerwca 2016 w HTML i CSS przez TestowanieTak Nowicjusz (120 p.)

0 głosów

1 odpowiedź 631 wizyt

Jak użyć clear:both bez float: left?

pytanie zadane 29 marca 2016 w HTML i CSS przez artimal Gaduła (4,800 p.)

Pomoc div na divie/ float:left/clear:both;

Zaloguj lub zarejestruj się, aby skomentować.

Zaloguj lub zarejestruj się, aby odpowiedzieć na to pytanie.

2 odpowiedzi

Zaloguj lub zarejestruj się, aby skomentować.

Zaloguj lub zarejestruj się, aby skomentować.

Podobne pytania

O działaniu forum

Pasja informatyki w internecie

Polecane miejsca w sieci