16-03-2011, 14:46
(Ten post był ostatnio modyfikowany: 16-03-2011, 14:55 przez marecki1122.)
Witam serdecznie. Postanowilem i ja poprosic was o pomoc z problemem dosyc dziwnym jak dla mnie...:/
Robie swoja strone zwiazana z fotografia i studiem gdzie pracuje i napotkalem problem tego typu ze gdy mam Div zawierajacy obrazek i tresc-opis i po zastosowaniu opcji float na obrazku by tekst ladnie go oplywal div zawierajacy footer czyli biale tlo ponizej przesuwa sie w gore nie wiem dlaczego:/ a tekst niekoniecznie oplywa jak powinien... prosze pomozcie...
O to kody:
HTML
CSS
pod FF wyglada ten problem tak:
http://www.vandj.webd.pl/cms/ff.jpg
a
pod IE
http://www.vandj.webd.pl/cms/ie.jpg
wyglada dobrze ale nie oblewa:/
Robie swoja strone zwiazana z fotografia i studiem gdzie pracuje i napotkalem problem tego typu ze gdy mam Div zawierajacy obrazek i tresc-opis i po zastosowaniu opcji float na obrazku by tekst ladnie go oplywal div zawierajacy footer czyli biale tlo ponizej przesuwa sie w gore nie wiem dlaczego:/ a tekst niekoniecznie oplywa jak powinien... prosze pomozcie...
O to kody:
HTML
Kod:
<?xml version="1.0" encoding="iso-8859-2"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="pl" lang="pl">
<head>
<meta http-equiv="Content-type" content="application/xhtml+xml; charset=iso-8859-2" />
<meta name="Description" content=" [wstaw tu opis strony] " />
<meta name="Keywords" content=" [wstaw tu slowa kluczowe] " />
<meta name="Author" content=" [dane autora] " />
<meta name="Generator" content="kED" />
<title> [tytuł strony] </title>
<link rel="stylesheet" href="css/style.css" type="text/css" />
</head>
<body>
<div id="center">
<div id="top">
<h1>Fotolink - Agnieszka i Jerzy Turek</h1>
<h2>Studio Fotograficzne</h2>
</div>
<hr>
<div id="menu">
<object codebase="http://fpdownload.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=8,0,0,0" align="left" width="900" height="28" id="Cool Horizontal XML Menu">
<param name="allowScriptAccess" value="sameDomain" />
<param name="movie" value="buton.swf" />
<param name="quality" value="High" /><param name="bgcolor" value="#000000" />
<embed src="buton.swf" quality="High" bgcolor="#333333" width="900" height="28" name="Cool Horizontal XML Menu" align="middle" allowScriptAccess="sameDomain" type="application/x-shockwave-flash" pluginspage="http://www.macromedia.com/go/getflashplayer" />
</object>
</div>
<hr>
<div id="obrazek">
<img src="foto.jpg" alt="foto">
</div>
<p>Studio powstało w 2001 roku.</p>
<hr>
<div id="footer"></div>
<hr>
<div id="stopka"><a href="adres stronki" target="_blank" rel="nofollow"></a></div>
</div>
</body>
</html>
CSS
Kod:
body
{
background-color: #000000;
}
#center
{
position: absolute;
left:50%;
margin-left: -450px;
top:0px;
width:900px;
}
#top
{
width: 900px;
height: 120px;
margin-top: 20px;
background: url(../tlo_header.jpg);
}
h1
{
width: 900px;
font-family: times new roman;
font-size: 40px;
color: #FFFFFF;
text-align: left;
margin-left: 10px;
}
h2
{
width: 900px;
font-family: times new roman;
font-size: 30px;
color: #FFFFFF;
text-align: left;
margin-top: -20px;
margin-left: 40px;
}
h4
{
width: 900px;
font-family: arial;
font-size: 16px;
color: #FFFFFF;
text-align: left;
margin-top: 0px;
margin-left: 0px;
}
#menu
{
width: 900px;
height: 28px;
background-color: #000000;
}
#rotator
{
width: 900px;
height: 400px;
background-color: #000000;
}
p
{
width: 900px;
height: 0 auto;
font-family: arial;
font-size: 16px;
color: #FFFFFF;
margin-left: 30px;
}
#obrazek
{
width: 150px;
height: 226px;
background-color: #000000;
float: left;
}
#footer
{
width: 900px;
height: 28px;
background-color: #FFFFFF;
font-family: arial;
font-size: 10px;
color: #000000;
text-align: right;
display: block;
}
#stopka
{
width: 900px;
height: 28px;
position: relative;
background-color: #000000;
font-family: arial;
font-size: 10px;
color: #FFFFFF;
text-align: right;
margin-top:20px;
clear:both;
}
a:link {
color:#FFFFFF;
text-decoration: none;
}
a:hover {
color:#FFFFFF;
text-decoration: none;
}
a:active {
color:#FFFFFF;
text-decoration: none;
}
a:visited {
color:#FFFFFF;
text-decoration: none;
}
pod FF wyglada ten problem tak:
http://www.vandj.webd.pl/cms/ff.jpg
a
pod IE
http://www.vandj.webd.pl/cms/ie.jpg
wyglada dobrze ale nie oblewa:/