Jest to moj pierwszy post i pierwsza strona www takze prosze o wyrozumialosc. Forum przejzalem dosc dokladnie (tak mi sie wydaje) ale to co znalazlem albo obchodzilo problem poprzez usuniecie pozycjonowania albo odsylalo do anglo-jezycznych stron, a ja nie bardzo w tym jezyku
. Chodzi o to ze jestli chce oblac zdjecie textem uzywajac float to fotka sobie lata tak jakos smiesznie(pierwszy screen), owszem jest oblana ale chcialbym zeby miala czarne tlo. Prubowalem wrzucic ja w diva ale normalnie sobie nad nim plywala i miala go gdzies, tak samo jak on ja bo nie zamierzal sie rozciagnac do jej rozmiarow. Gdy zamiast float uzyje vertical-laign to text jest z boku foty i ona sama ma ladne tlo ale tylko jak jest jedna linijka textu, jak jest wiecej to sie robi tak jak na drugim screen'ie. Troche sie juz z tym mecze i nie moge dac rady. Stronka sie waliduje, ale pewnie blad zrobilem ja gdzies z tym pozycjonowaniem - narazie jakos tak na czuja to robie 
. Moze faktycznie zrobic z float'ami zamiast z position.
P.S. stronka w budowie takze w css jest jeszcze maly balagan, fotek inaczej tez nie umialem wrzucic (i na to pewnie jest rada ale to innym razem
)za co przepraszam.
screen'y
html:
- Kod: Zaznacz cały
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="pl" lang="pl">
<head>
<meta http-equiv="content-type" content="text/html; charset=iso-8859-2"/>
<title>stronka strychowa</title>
<link rel="stylesheet" href="style.css" type="text/css"/>
</head>
<body>
<div id="banner"></div>
<div id="strych"><p>Strych Attic Dachboden Grenier Soffitta Desván verdak</p></div>
<div id="prawa">
<p>bla bla bla bla bla bla bla bla bla bla bla bla bla bla
bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla
bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla </p>
<p><span>bla bla bla bla :</span>
bla bla bla bla bla bla bla bla bla bla bla bla bla bla </p>
</div>
<div id="lewa">
<h2>_menu:</h2>
<ul>
<li><a href="..\index.html">home</a></li>
<li><a href="new.html">nowości</a></li>
<li><a href="foto.html">foto</a></li>
<li><a href="band.html">zespół</a></li>
<li><a href="polecamy.html">polecamy</a></li>
<li><a href="a.htm">księga gości</a></li>
<li><a href="mailto:vicia85@gmail.com">kontakt</a></li>
</ul>
</div>
<div id="srodek">
<h1>NOWOŚCI</h1>
<p><img src="foto\mati\2.jpg" alt="polegly" style="float: left; width: 200px;"/>bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla </p>
<p>
bla bla bla bla bla bla bla bla
</p>
<p>bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla </p>
<p>21.02.06 bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla
</p>
</div>
</body>
</html>
css:
- Kod: Zaznacz cały
body
{
margin: 5px;
padding: 5px;
background-color: black;
scrollbar-3dlight-color:silver;
scrollbar-arrow-color:orange;
scrollbar-base-color:black;
scrollbar-dark-shadow-color:black;
scrollbar-face-color:black;
scrollbar-highlight-color:silver;
scrollbar-shadow-color:silver
}
div
{
position: fixed;
border: 1px solid white;
margin:0;
padding: 5px;
vertical-align: top;
background: dimgray url(plomienie.jpg) repeat fixed;
}
div#banner
{
top: 0;
left: 10px;
right: 10px;
margin: 0;
height:40px;
background: url(banner.gif) repeat;
border-bottom: 0;
z-index: 25;
}
div#strych
{
top:50px;
left: 10px;
right: 10px;
background: black;
margin: 0 0 5px 0;
border-top: 0;
z-index: 24;
}
div#lewa
{
top: 90px;
left: 10px;
width: 170px;
z-index: 1;
}
div#prawa
{
top: 90px;
right: 10px;
width: 170px;
z-index: 2;
}
div#srodek
{
position: static;
margin: 80px 190px 0 190px;
min-width: 350px;
z-index: 3;
}
div#lewa h2
{
background: black;
letter-spacing: 0.5em;
margin: 0 0 2px 0;
padding: 5px;
font: bold 13px verdana;
color:orange;
border: 1px solid white;
}
div#lewa ul
{
padding: 0;
margin: 0;
width: 150px;
list-style-type: none;
font-weight: bold;
font-size: 12px;
font-family: verdana;
}
div#lewa ul li
{
color: orange;
margin: 0 0 2px 0;
border: 1px solid white;
background: black;
}
div#lewa ul a
{
display: block;
color: white;
padding: 5px 15px 5px 15px;
text-decoration: none;
}
div#lewa ul a:hover
{
color: orange;
background: black;
letter-spacing: 0.5em;
}
div#prawa p
{
background: black;
margin: 5px 0 4px 0;
padding: 5px;
font: bold 11px verdana;
color: white;
border: 1px solid white;
}
div#prawa p span
{
margin: -3px -5px 3px -5px;
padding: 3px;
border: 0;
color: white;
background: black;
display: block;
text-align: center;
}
div#strych p
{
background: black;
margin: 0 0 5px 0;
padding: 0;
font: normal 11px verdana;
color: red;
text-align: center;
word-spacing: 2cm;
}
div#srodek h1
{
color: white;
background: black;
margin: 0 0 2px 0;
padding: 5px;
font: bold 15px verdana;
border: 1px solid white;
text-align: center;
}
div#srodek p
{
background: black;
margin: 10px 0 4px 0;
padding: 5px;
font: normal 11px verdana;
color: white;
line-height: 150%;
text-align: justify;
border: 1px solid white;
}
img
{
border:0;
vertical-align: right;
clear:left;
margin: 2px;
}
ul
{
color: white;
background: black;
margin: 5px 0;
list-style-type: none;
}
a.normal:hover
{
color: orange;
background: black;
letter-spacing: 0.5em;
}
a.polecamy
{
color: white;
text-decoration: none;
}
a.foto:hover
{
color: orange;
background: black;
}
a.foto
{
color: white;
text-decoration: none;
}
a.img
{
border: 0;
text-decoration: none;
margin: 0;
padding: 0;
}
div.lista
{
background: black;
position: relative;
top: 5px;
right: 0;
left: 0;
}
div.kom1
{
position: static;
background: black;
width: 250px;
margin: 0px;
display: inline;
}
td.foto
{width: 50%;}
. jak potrzeba to moge dac screen'a. W zasadzie to moze i dziala bo caly text oblewa fotke, tylko to jakos tak nieladnie wyglada, tzn. musialbym ta fotke wrzucic razem z akapitem w jakas komorke tabeli albo siakiegos div'a bo teraz to ona zachodzi na tlo akapitow, chociaz text po wyrzuceniu jej z <p> juz ja ladnie oplywa. probowalem wrzucic w inny div ale wtedy rozciagal mi sie div#srodek a ten do ktorego wrzucilem fotke niebardzo. Powalcze jeszcze i dam znac jak mi z tym idzie. Tymczasem dzieki za pomoc.