[pulpido]

Witam. Kiedyś uczyłem się samego html, dlatego wczoraj go sobie tylko przypomniałem i zacząłem uczyć się CSS. Korzystam z kursu "pl.html.net", ale szukałem też na "kurshtml.boo.pl" i nie mogę znaleźć, jak ustawia się, gdzie ma być dany obrazek? Jak ustawić żeby był np. 200px od góry i 100px od lewej?

[Jarek]

Sam uczyłem się z kurshtml.boo.pl za czasów kiedy jeszcze nie był tak rozbudowany jak teraz i polecam go.
Co do ustawienia obrazka to odstęp od lewej to margin-left: ??? px;
od góry: margin-top: ??? px; gdzie ??? to ilość pikseli.

[mervin]

<img style="position: relative; top: XXpx; left: XXpx;">

[pulpido]

Jarek, czyli ma to wyglądać tak:

#ramka1 {
background-image: url(images/ramka.png); 
width: 392px; 
height: 241px; 
margin-left: 950 px;
margin-ltop: 400 px;
}

?

[Jarek]

margin-left: 950 px;
margin-ltop: 400 px;

a czy obrazek ma się znajdować 950 pikseli od lewej i 400pikseli od góry?
Jeżeli tak to tak z tym, że przesunie Ci on całą zawartość strony.
Musisz pamiętać, że odstępy te brane są względem poprzedniego elementu.
i masz literówkę, top a nie ltop.

[pulpido]

Już sobie poradziłem. Dodałem

position: absolute;
right: XXpx;
top: XXpx;

do pliku .css

[mervin]

Użytkownik pulpido dnia 25 listopad 2010 - 21:11 napisał

Już sobie poradziłem. Dodałem

position: absolute;
right: XXpx;
top: XXpx;

do pliku .css

przetestuj stronę w różnych przeglądarkach i rozdzielczościach i sprawdź czy wszystkie elementy wyświetlają się prawidłowo.

[pulpido]

Jak okno przeglądarki jest maksymalne to wszystko hasa, ale jak zmniejsze okno, to wszystko się przesuwa ;/
adres portfolio: pulpido.freecast.pl
Jak to naprawić?

[Jarek]

Daj stronie stałą szerokość.
Do body dodaj:

text-align: center;
margin:0;
padding:0;

Całość obejmij divem:

#strona {
width: 900px; /* czy ile tam masz tej szerokości */
margin:0 auto;
text-align:left;
overflow:hidden;
}

Nie rób position absolute.
Zamiast tego dopisz do tych swoich pól:

float:left; 

i odstępy od góry i dołu robisz względem poprzedniego elementu.

[pulpido]

Czyli teraz w CSS zamiast

left: 250px;
top: 250px;

co mam wstawić, żeby określić gdzie ma znajdować się dany obrazek?

Pierwszy raz koduje jakąś stronę i nie jestem jeszcze obeznany ze wszystkim, dlatego się pytam. Szukałem tego na różnych kursach html i css ale nie mogłem tego znaleźć.

[Jarek]

Podobnie jak masz div "omnie3".
Potem edytuj styl omnie3, wywal te odstępy i przenieś go do środka ramka1.
Nie może być tak, że jakiś div jest pusty.
Zrób

<div id="ramka1"><div id="omnie3">tresc</div></div> 

A co do kursu to prześledź tą część http://www.kurshtml..../marginesy.html

[pulpido]

a jak ustawić gdzie ma się znajdować ramka1?

[Jarek]

Użytkownik pulpido dnia 27 listopad 2010 - 21:14 napisał

a jak ustawić gdzie ma się znajdować ramka1?

#ramka1 {
background-image:url("images/ramka.png");
height:246px;
float:left;
margin-left:220px;
width:400px;
}

[stozek419]

<div style="position:relative; top:150px; left:445px;">
<IMG SRC="???.jpg" WIDTH="350" HEIGHT="320" BORDER="0">
/></a></div>