• Najnowsze pytania
  • Bez odpowiedzi
  • Zadaj pytanie
  • Kategorie
  • Tagi
  • Zdobyte punkty
  • Ekipa ninja
  • IRC
  • FAQ
  • Regulamin
  • Książki warte uwagi

question-closed Problem CSS i JS

VPS Starter Arubacloud
0 głosów
228 wizyt
pytanie zadane 31 stycznia 2019 w HTML i CSS przez zerakot Obywatel (1,870 p.)
zamknięte 1 lutego 2019 przez zerakot
Witam,

Mam taki element na stronie, który po najechaniu na niego pod nim pokazuje opis, ale pod nim jest zdjęcie innego elementu, więc czy da się zrobić aby ten "opis" po rozwinięciu przesuwał ten obrazek na dole?
komentarz zamknięcia: Znalezienie odpowiedzi
1
komentarz 31 stycznia 2019 przez pablop76 VIP (123,060 p.)
Prawdopodobnie się da, ale nie wiemy jak jest skonstruowany Twój obiekt. Podaj ten fragment kodu. Umieść go w odpowiednich blokach css, html za pomocą funkcji edytora  {...}
komentarz 31 stycznia 2019 przez zerakot Obywatel (1,870 p.)
edycja 31 stycznia 2019 przez zerakot
<div class="tekst">
				<div class="zdjecie">
					<img src="potamtej.jpg" />
				</div>
				<div class="tytol">
					<b>Po tamtej stronie drzwi</b><br />Horror<br />
				</div>
				<center><b><a href="Film8.mp4" name="film">Oglądaj film</a></b></center>
				<center><input type="submit" value="Opis" onMouseOver="wypisz7()" onMouseOut="schowaj7()" id="opisy7"/></center>
				<div id="opis7"></div>
			</div>

 

var tekst7="Po śmierci syna Maria wyrusza do starożytnej hinduskiej świątyni, by nawiązać z nim kontakt. Otwiera drzwi między światami, które miały być na zawsze zamknięte. "
function wypisz7()
{
	document.getElementById("opis7").innerHTML = tekst7;
}
function schowaj7()
{
	document.getElementById("opis7").innerHTML = "";
}

 

komentarz 31 stycznia 2019 przez pablop76 VIP (123,060 p.)
W podamy fragmencie kodu opisany przez Ciebie problem nie występuje.
komentarz 31 stycznia 2019 przez zerakot Obywatel (1,870 p.)
A gdzie on ma wystąpić?
komentarz 31 stycznia 2019 przez zerakot Obywatel (1,870 p.)

@pablop76,
 Tu jest css:

.tekst
{
	margin-top:20px;
	margin-left: 30px;
	margin-bottom: 80px;
	width: 133px;
	height: 196px;
	border: 2px dotted black;
	float: left;
}

.tytol
{
	text-align: center;
	padding-bottom: 6px;
	width: 133px;
}

.rodzaj
{
	margin-bottom: 60px;
}

input[type="submit"]
{
	color: black;
	background: #616265;
	padding: 3px;
	border-radius: 50px;
	cursor: pointer;
	border: 2px solid black;
}

#opis, #opis1, #opis2, #opis3, #opis4, #opis5, #opis6, #opis7
{
	margin-left: 10px;
	font-family: 'Sarabun', sans-serif;
	text-align: left;	
}

}
#opisy, #opisy1, #opisy2, #opisy3,#opisy4, #opisy5, #opisy6, #opisy7
{
	margin-top: 5px;
}

 

1 odpowiedź

0 głosów
odpowiedź 31 stycznia 2019 przez pablop76 VIP (123,060 p.)
Nadałeś dla pojemnika .text wysokość na sztywno 195px, więc dodatkowy tekst nie ma gdzie się zmieścić i wylewa się poza pojemnik. Usuń tą właściwość i  zrób jakiś odstęp pading-bottom. Nie wiem o jaki obrazek chodzi ale podejrzewam, że masz problem z brakiem clear: both;
komentarz 31 stycznia 2019 przez zerakot Obywatel (1,870 p.)
edycja 31 stycznia 2019 przez zerakot
Ok, zrobiłem tak, i element na dole się przesówa po dodaniu clear: both, ale element, który ma mieć float: left do niego jest pod nim zamiast obok.
komentarz 31 stycznia 2019 przez pablop76 VIP (123,060 p.)
Jak wyżej. Nie podałeś reszty kodu, więc nie będę zgadywać.

Podobne pytania

+1 głos
1 odpowiedź 269 wizyt
0 głosów
1 odpowiedź 132 wizyt
pytanie zadane 11 lutego 2019 w SQL, bazy danych przez zerakot Obywatel (1,870 p.)
0 głosów
1 odpowiedź 178 wizyt
pytanie zadane 30 kwietnia 2017 w HTML i CSS przez necik Początkujący (430 p.)

92,453 zapytań

141,262 odpowiedzi

319,088 komentarzy

61,854 pasjonatów

Motyw:

Akcja Pajacyk

Pajacyk od wielu lat dożywia dzieci. Pomóż klikając w zielony brzuszek na stronie. Dziękujemy! ♡

Oto polecana książka warta uwagi.
Pełną listę książek znajdziesz tutaj.

Akademia Sekuraka

Akademia Sekuraka 2024 zapewnia dostęp do minimum 15 szkoleń online z bezpieczeństwa IT oraz dostęp także do materiałów z edycji Sekurak Academy z roku 2023!

Przy zakupie możecie skorzystać z kodu: pasja-akademia - użyjcie go w koszyku, a uzyskacie rabat -30% na bilety w wersji "Standard"! Więcej informacji na temat akademii 2024 znajdziecie tutaj. Dziękujemy ekipie Sekuraka za taką fajną zniżkę dla wszystkich Pasjonatów!

Akademia Sekuraka

Niedawno wystartował dodruk tej świetnej, rozchwytywanej książki (około 940 stron). Mamy dla Was kod: pasja (wpiszcie go w koszyku), dzięki któremu otrzymujemy 10% zniżki - dziękujemy zaprzyjaźnionej ekipie Sekuraka za taki bonus dla Pasjonatów! Książka to pierwszy tom z serii o ITsec, który łagodnie wprowadzi w świat bezpieczeństwa IT każdą osobę - warto, polecamy!

...