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

Przyklejenie tekstu do góry

Object Storage Arubacloud
0 głosów
1,225 wizyt
pytanie zadane 17 sierpnia 2016 w HTML i CSS przez alus152 Bywalec (2,690 p.)

Cześć potrzebuję pomocy, a dokładniej na jednej podstronie wszystko fajnie mi idzie ale w pewnym momencie chciałbym aby tekst był troszke wyżej i nie mam pojęcia jak go tam przenieść :/

<div id="birds">
			<div id="cockatiel">
				<h1>Cockatiel Parrot</h1>
				<div id="cockatiel-image"></div>
				<div style="clear: both;"></div>
				<div id="cockatiel-about">
					<p>Size: 36 - 46 cm/ 14- 18 inches <br><br>
					Life expectancy: 12 - 30 years </p>
				</div>
				<div id="cockatiel-description">
					<p>The normal cockatiel is slate gray, reminiscent of a comon pigeon. This is the form that exists in the wilds of Australia. A yellow suffusion covers the entire bird. This yellow is especially prominent in the head and crest of the male bird. Youngsters and hens have horizontal b ars going down the tail.</p>
				</div>
				<div style="clear: both;"></div>
			</div>
#birds{
	width: 100%;
	height: 100vh;
	background-color: #303030;
	text-align: center;
}

#cockatiel h1{
	color: white;
	font-weight: 200;
	font-size: 3em;
}
#cockatiel{
	margin: auto;
	margin-left: 100px;
	margin-right: 100px;
}
#cockatiel-image{
	width: 300px;
	height: 300px;
	border-radius: 50%;
	-webkit-border-radius: 50%;
	-moz-border-radius: 50%;
	background: url(../img/cockatiel.jpg) no-repeat;
	background-size: cover;
	float: left;
}
#cockatiel-about{
	margin-top: 5%;
	float: left;
	color: white;
	width: 300px;
}
#cockatiel-description{
	margin-left: auto;
	margin-right: auto;
	text-align: justify;
	width: 500px;
	vertical-align: text-top;
}
#cockatiel p{
	color: white
}

Chciałbym zrobić takiego diva o szerokości 500px i wysokości którą pokażę wam na zdjęciu poniżej (jak to miałoby wyglądać) https://zapodaj.net/f69825fc453f8.png.html

3 odpowiedzi

0 głosów
odpowiedź 17 sierpnia 2016 przez czmyk Obywatel (1,100 p.)
Nie wiem o co dokladnie Ci chodzi ale to powinno pomoc:

margin-top:0px;
0 głosów
odpowiedź 18 sierpnia 2016 przez Orkoo7 Bywalec (2,670 p.)

Spróbuj:

margin-top:-100px;

 

0 głosów
odpowiedź 18 sierpnia 2016 przez jaca121212 Nałogowiec (40,760 p.)
Brak zamknięcia diva.

Style pisze się  do class a nie do ID. ID jest do jquery / javascript.

Trochę nie podoba mi się układ twoich divów.

Nie masz problemu z wyświetlaniem obrazka?
komentarz 18 sierpnia 2016 przez alus152 Bywalec (2,690 p.)
właśnie z obrazkiem jest wszystko dobrze :) tylko ten napis jakby przykleił się do tego co jest pod miniaturką i jak wpisze float: left; to wszystko idzie na lewo tzn jak wpisze w divie Cockatiel-about :)
komentarz 18 sierpnia 2016 przez jaca121212 Nałogowiec (40,760 p.)
wstaw kod na http://codepen.io/ cały wraz z body  to zobaczę jak to wygląda na live.
komentarz 18 sierpnia 2016 przez alus152 Bywalec (2,690 p.)
cześć, niestety zmieniłem już kod ale może byś pomógł chciałbym wyrównać tekst w belce menu w pionie i nie wiem czy tak jest dobrze i na innych rozdzielczosciach będzie to wyglądało dobrze tutaj link: http://codepen.io/anon/pen/KrEOmp w dodatku chciałbym aby po zescrollowaniu do np diva Modrolotki napis zaświecił się na ten sam kolor co po najechaniu Pozdrawiam i dzięki za odpowiedzi :)
komentarz 18 sierpnia 2016 przez jaca121212 Nałogowiec (40,760 p.)
Resztę to musisz sobie dorobić jak i poprawić nawigację RWD ale id w ten deasing menu hamburger dość popularne przy RWD.

http://codepen.io/jaca121212/pen/GqLgOP

Podobne pytania

+1 głos
1 odpowiedź 377 wizyt
0 głosów
0 odpowiedzi 153 wizyt
pytanie zadane 9 sierpnia 2017 w HTML i CSS przez IlovePython Nowicjusz (120 p.)
0 głosów
1 odpowiedź 93 wizyt
pytanie zadane 30 października 2016 w HTML i CSS przez NaczelnyNieuk Początkujący (260 p.)

92,551 zapytań

141,393 odpowiedzi

319,522 komentarzy

61,936 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

Kolejna edycja największej imprezy hakerskiej w Polsce, czyli Mega Sekurak Hacking Party odbędzie się już 20 maja 2024r. Z tej okazji mamy dla Was kod: pasjamshp - jeżeli wpiszecie go w koszyku, to wówczas otrzymacie 40% zniżki na bilet w wersji standard!

Więcej informacji na temat imprezy 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!

...