De PHPhulp kroeg
autospacing in layout
Ik heb een layout gemaakt in illustrator en photoshop. Eenmaal in dreamwaver verander ik de gif files onder de menu balk (links, rechts en midden) naar een background image zodat ik in het middelste vlak tekst kan typen. Ik typ mijn tekst, tot nu geen problemen. Als ik echter onder het einde van de background image ben gekomen krijg ik een rode opvulling. Ik wil echter dat de background images meerekken en zich aanpassen aan de hoeveelheid getypte tekst. Is dit mogelijk en hoe?
Groeten,
TV.
http://img235.imageshack.us/img235/923/stap1ul1.jpg
http://img53.imageshack.us/img53/3329/stap2ym8.jpg
Gewijzigd op 01/01/1970 01:00:00 door Tommy
thx
Code (php)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title>Meerekkend plaatje</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<style type="text/css">
html, body {
margin: 0;
padding: 0;
height: 100%;
}
img.rek_mee {
width: 100%;
left: 0;
top: 0;
position: absolute;
z-index: 0;
}
</style>
</head>
<body>
<img src="gekleurde_krijtjes.jpg" class="rek_mee" alt="Ik rek mee" />
</body>
</html>
<html>
<head>
<title>Meerekkend plaatje</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<style type="text/css">
html, body {
margin: 0;
padding: 0;
height: 100%;
}
img.rek_mee {
width: 100%;
left: 0;
top: 0;
position: absolute;
z-index: 0;
}
</style>
</head>
<body>
<img src="gekleurde_krijtjes.jpg" class="rek_mee" alt="Ik rek mee" />
</body>
</html>
hm kga het ook eens proberen aan de hand van css..
http://www.jankoehoorn.nl/rek_mee.php
ik zie daar niets..
Gewijzigd op 01/01/1970 01:00:00 door Tommy
div.layout-29 {
position:absolute;
left:19px;
top:262px;
width:725px;
height:148px;
}
div.index-30 {
position:absolute;
left:744px;
top:262px;
width:22px;
height:148px;
}
div.index-31 {
position:absolute;
left:0px;
top:410px;
width:766px;
height:26px;
}
Gewijzigd op 01/01/1970 01:00:00 door Tommy
ik weet echt niet waar te beginnen. heb de layout vanuit photoshop > safe for web > css by classes geexporteerd
Ik heb nu dit:
div.layout-29 {
position:absolute;
left:19px;
top:263px;
width:100%;
height:1;
background-image:url(images/layout_29.gif);
}
alleen helpt dit mijn probleem niet. is het echt niet mogelijk dat gif de afmetingen aannemen van een cel in html?
edit: vroeger deed ik het met rowspan maar ik werk nu met een gradient waadoor dat niet meer mogelijk is. Ik ga eff proberen de gradient in stukken te snijden, misschien levert dat meer resultaat op
Gewijzigd op 01/01/1970 01:00:00 door Tommy
Code (php)
1
2
3
2
3
td.content {
background: #09f url(gradient.jpg) center bottom repeat-x;
}
background: #09f url(gradient.jpg) center bottom repeat-x;
}
dan ben je eigenlijk al klaar. Die kleur #09f moet je wel aanpassen zodat hij precies klopt.