Forum PHP.pl > Div główny i dwa divy obok siebie wewnątrz niego.

Pomoc - Szukaj - Użytkownicy - Kalendarz

Pełna wersja: Div główny i dwa divy obok siebie wewnątrz niego.

Forum PHP.pl > Forum > Po stronie przeglądarki > CSS

8rol

8.01.2010, 15:43:38

Witam.

Mam jednego większego diva (wyśrodkowany margin: auto), a wewnątrz niego dwa inne divy.
Chciałbym aby dwa te divy znajdowały się obok siebie, jednak gdy nadam im float: left; to wypadają one z tego głównego diva.

Bardzo proszę o radę.

trucksweb

8.01.2010, 16:18:24

glownemu tez ustawiasz float:left i najlepiej tez position:relative

8rol

8.01.2010, 16:30:57

Dzięki, podziałało, jednak teraz główny div nie znajduję się już na środku ekranu, co z tym zrobić?

Mam jeszcze pytanie jak ustawiać pozycje tych wewnętrznych divów względem tego głównego, a nie całego ekranu?

trucksweb

8.01.2010, 18:14:34

wklej kod jaki masz lacznie z css to zobaczymy bo teraz nie rozumiem

8rol

9.01.2010, 00:49:37

Zostawiłem tylko to co jest kluczowe, aby przedstawić mój problem.

CSS:

[HTML] pobierz, plaintext 
body {
	background: #f3fcfe;
	font-family: Georgia, serif;
	margin: 0 auto; 
 
}
 
#ustawienia {
width: 60%;
background: #c6d7ed;
border: solid 1px #9dbbe0;
padding: 2px;
float:left;
 
}
 
#tabelka {
float:left
}
 
#para{
position:relative;
top: 20%;
left: 30%;
float:left
}
[HTML] pobierz, plaintext

HTML:

[HTML] pobierz, plaintext 
<html>
<head>
	<title>Tytul</title>
	<link rel="stylesheet" type="text/css" href="styl.css">
</head>
 
<body>
	<div id="ustawienia">
		<div id="tabelka">
		<table border="1">
		<tr><th>ID</td><th>nazwa1</th><th>nazwa2</th></tr>
		<tr><td>test</td><td>test</td><td>test</td>
		<tr><td>test</td><td>test</td><td>test</td>
		<tr><td>test</td><td>test</td><td>test</td>
		<tr><td>test</td><td>test</td><td>test</td>
		<tr><td>test</td><td>test</td><td>test</td>
		<tr><td>test</td><td>test</td><td>test</td>
		<tr><td>test</td><td>test</td><td>test</td>
		</table>
	</div>
 
	<div id="para">
		<table border="1">
		<tr><th>ID</td><th>nazsdfwa1</th><th>nasdzwa2</th></tr>
		<tr><td>tesdst</td><td>tesst</td><td>test</td>
		<tr><td>tesst</td><td>tesdst</td><td>test</td>
		<tr><td>tesfst</td><td>tesdfst</td><td>test</td>
		<tr><td>tesdfst</td><td>tsdfest</td><td>test</td>
		<tr><td>tesdfst</td><td>tsdfest</td><td>test</td>
		<tr><td>tsdfest</td><td>tsdfest</td><td>test</td>
		<tr><td>tsdfest</td><td>tsdfest</td><td>test</td>
		</table>
	</div>
 
 
	</div>
</body>
</html>
[HTML] pobierz, plaintext

Chodzi teraz o to, aby ten główny div (id="ustawienia") był wyśrodkowany.

athei

9.01.2010, 12:12:23

Z #ustawienia usuń float: left i daj margin: 0 auto; overflow: hidden;

To jest wersja lo-fi głównej zawartości. Aby zobaczyć pełną wersję z większą zawartością, obrazkami i formatowaniem proszę kliknij tutaj.