Pomoc - Szukaj - Użytkownicy - Kalendarz
Pełna wersja: Div, Form i tło div'a
Forum PHP.pl > Forum > Po stronie przeglądarki
daris
Mam taki kod:

  1. <div class=panel>
  2.   <div class=title>Styl</div> <!-- to tytuł, tło to górna zaokrąglona ramka -->
  3.   <div class=content> <!-- tu jest kolor jako tło i border-left i right -->
  4.     <form method="post" action="style.php">Wybierz styl z poniższej listy:
  5.       <select name="style"><option value=black selected>black</option></select>
  6.       <input type="submit" value="OK">
  7.     </form> 
  8.   </div>
  9.   <div class=panel_bottom></div> <!-- to dół panelu, tło to obrazek z zaokrągloną ramką -->
  10.   </div>



i na dole wyświetla się bez tła:



Problem występuje tylko jeśli zawartość div'a kończy się na </form>. Znalazłem obejście dodając &nbsp za </form>, ale to znów daje nową linię. Co jest nie tak?
grzesiek_g
Spróbuj pobawić się float, jeśli to nic nie da to overflov. Najlepiej w FF zainstaluj np. Firebug - ładnie pokaże ci granice tego div-a i będziesz mógł poeksperymentować ze stylami.
daris
Z Firebuga dowiedziałem się tylko tyle że form wyłazi za content. Próbowałem contentowi dać height: 100% ale wtedy każdy panel ma długość ok. 1400px biggrin.gif

edit: rozszerzenie content'a też nic nie daje

edit2: pomogło dodanie:
Kod
.content {
    overflow: auto;
}

chociaż pod Firefoksem nadal jest odstęp (nowa linia?) pod form'em (w operze jest dobrze)
grzesiek_g
Jeśli masz mozliwośc podania linka to go podaj, będzie łatwiej coś powiedzieć.
batman
Podaj kod CSS. Może tam masz coś namieszane. Zanim to jednak zrobisz ustaw margin i padding na 0 dla znacznika form.
daris
Cytat(batman @ 17.01.2008, 15:11:13 ) *
Zanim to jednak zrobisz ustaw margin i padding na 0 dla znacznika form.

Problem po raz drugi rozwiązany biggrin.gif Pierwsze (overflow: auto) było niepotrzebne. Pomogło oczywiście dodanie do css'a:

Kod
form {margin: 0px;}



Teraz działa i pod Firefoksem i pod Operą (a pod IE to nie wiem czy się czasem cała strona nie rozleci bo ani razu nie testowałem ;P (a na windowsa nie za bardzo chce mi sie przechodzić winksmiley.jpg (linux only winksmiley.jpg )))
grzesiek_g
O ile dobrze pamiętam to form nie ma nadanych standardowo żadnych styli, jedynie fieldset ma border, więc musiałeś gdzieś nadać sam ten margin.
daris
Pewnie sobie odziedziczył po np:
.panel {margin-bottom: 10px;}
batman
Cytat
O ile dobrze pamiętam....

Źle pamiętasz.
Znaczniki z domyślnymi marginesami i/lub dopełnieniami: form, ul, li, p, h(1,2,....).

edit
Marginesy i dopełnienia nie są dziedziczone. W IE występuje błąd na dublowaniu dopełnienia, ale to już inna bajka winksmiley.jpg
grzesiek_g
Cytat(batman @ 17.01.2008, 15:52:22 ) *
Źle pamiętasz.
Znaczniki z domyślnymi marginesami i/lub dopełnieniami: form, ul, li, p, h(1,2,....).

Mogę, źle pamiętać bo używam resetowania styli na początku i to wkleja mi się automatycznie przy tworzeniu nowego pliku. Ale pisząc tamtego posta zerknąłem jeszcze do wydrukowanej dokumentacji i nic tam nie było o predefiniowanych stylach dla form. Dla innych które wymieniłeś (nie wszystkie, np blockquote) są odpowiednie wpisy.
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.
Invision Power Board © 2001-2025 Invision Power Services, Inc.