PHPhulp.nl
35k+ leden Over PHPhulp Offerte opdracht Contact
T

autospacing in layout

Door Tommy op 16-09-2006 18:03
3.201 views
Hallo,
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
T Tommy
17-09-2006 10:35
neen dit is niet wat ik bedoel. de layout moet zich niet aanpassen aan de grote van het venster maar aan de inhoud van het middenste vak. Als er meer tekst is in het middenste vak moeten de background gif mee uitrekken. De gifs links en rechts moeten dat ook...


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;
}
Jan Koehoorn
17-09-2006 10:36
Het was ook geen kant en klaar script, het was een voorbeeld om te laten zien dat het mogelijk is.
T Tommy
17-09-2006 10:39
moet ik dan het gif bestand als background-image nemen in de css class? moet ik de position veranderen?
ik weet echt niet waar te beginnen. heb de layout vanuit photoshop > safe for web > css by classes geexporteerd
Jan Koehoorn
17-09-2006 10:47
Je kunt toch gewoon de source-code van mijn voorbeeld bekijken om te zien hoe het gedaan is?
T Tommy
17-09-2006 10:52
daar kan ik niets mee doen door de h&w inte stellen op 100% krijg ik alleen maar rare effecten.
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?
Jan Koehoorn
17-09-2006 10:53
Ik zal even voor je kijken, moment.
T Tommy
17-09-2006 10:56
http://www.php-stuff.net/layout/ hier is alles wat ik heb

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
T Tommy
17-09-2006 11:15
ja, idd als de text langer word moet de achtergrond afbeelding worden uitgerokken en de 2 gif files aan de linker en rechterkant natuurlijk ook om de mooie layout te behouden.
Jan Koehoorn
17-09-2006 11:19
Dit effect kun je bereiken met 1 plaatje. De basiskleur van je cel is blauw, met een gradient naar wit aan de onderkant. Als je dus zoiets doet:

    td.content {
        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.

Reageren

Inloggen om te reageren