Forum PHP.pl > Podrzędność div?

Pomoc - Szukaj - Użytkownicy - Kalendarz

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

ones

13.07.2009, 16:07:15

Witam!
Mam problem.
Chcę pociąć szablon do div i w tym wypadku chciałbym aby był nadrzędny div z ramką w której reszta div'ów się znajduje. Pierwsze div'y działają odpowiednio lecz gdy dodam drugie wraz z float: right i left to drugie div'y wyskakują z ramki nadrzędnej.
Screen:

Kod:

[HTML] pobierz, plaintext 
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
  <head>
  <link rel="Stylesheet" type="text/css" href="style.css" />
  <meta http-equiv="content-type" content="text/html; charset=UTF-8">
  <meta name="generator" content="PSPad editor, www.pspad.com">
  <title></title>
  </head>
  <body>
  <div id="glowny">
    <div class="top">
      <div class="logo"></div>
      <div class="menugora">Home Page<img src="images/znacznik_menu.gif">Home Page</div>
    </div>
    <div class="user">
      <div class="user1"></div>
      <div class="user2"></div>
    </div>
  </div>
  </body>
</html>
[HTML] pobierz, plaintext

[HTML] pobierz, plaintext 
/* CSS Document */
html, body {
	background-color: #e2e2e2;
	margin: 0;
	padding: 0;
  width: 700px;
  margin: 20 auto;
}
#glowny{
  width: 700px;
  background-color:#ffffff;
  border-style: solid;
  border-width: 2px;
  border-color: #cdcdcd;
  vertical-align:middle;
  display: block;
}
.top {
  height: 55px;
}
.logo {
  background-image: url(images/logo.gif);
  background-repeat: no-repeat;
  height: 55px;
  width: 233px;
  float: left;
}
.menugora {
  font-family: Tahoma;
  font-size: 12px;
  color: #bfbfbf;
  width: 467px;
  float: right;
  margin: 20 auto; 
}
.user {
  height: 215 px;
}
DIV.user1 {
  height: 215px;
  width: 198px;
  background-image: url(images/logo2.gif);
  background-repeat: no-repeat;
  margin: 0 0 0 50;
  float: left;
}
.user2{
  height: 215px;
  width: 401px;
  background-image: url(images/image.gif);
  background-repeat: no-repeat;
  margin 0 0 0 0;
  float: left;
}
[HTML] pobierz, plaintext

erix

13.07.2009, 16:26:40

Daj ten kod na żywo.

ones

13.07.2009, 16:49:35

http://www.gose.pl/pensjonat

erix

13.07.2009, 18:01:42

I co do kodu, w czym tkwi problem...?

ones

13.07.2009, 18:14:47

Jak widać na obrazku czy screenie.
Jak mogę zrobić aby te obrazki, które są poza tą białą ramką był w tej białej ramce? Aby ona się rozciągnęła?
Bez atrybutów float rozciąga się lecz obrazki są pod sobą. Chciałbym aby to wszystko było w tej białej ramce, w której znajduje się logo i prowizoryczne menu.

Obrazowo... ;-) Jak miałoby to wyglądać. Z marginesami między obrazkami już sobie poradzę ;-)

prszakal

14.07.2009, 07:24:24

1) Cierpisz na chorobę zwaną divitis
2) Rozwiązaniem Twojego problemu jest właściwiość overflow z wartością hidden, którą powinieneś nadać rodzicowi rzekomo "wyskakujących" elementów.

pozdrawiam
prszakal

ones

14.07.2009, 12:16:59

Już sobie jako tako z tym poradziłem, lecz dodając overflow: hidden do rodzica znika mi połowa iframe maps google, która nie rozciąga diva odpowiednio.

Nie mam pojęcia czemu iframe nie rozciąga pod FF, pod IE rozciąga normalnie.

Może w tym mi pomożecie?

Już sobie poradziłem.
Użyłem na początku strony:

[HTML] pobierz, plaintext 
<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE html 
     PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
[HTML] pobierz, plaintext

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.