Beste ICT scripters,
mijn DIV kennis is niet super uitgebreid en alweer iets wat verouderd.
Voor mijn layouts werkte ik namelijk altijd met tables (shame on me, I know ;))
echter ben ik nu bezig aan mijn bedrijf pagina en wil ik iets creëren wat ik in tables weet te doen, maar in divs niet (makkelijk, zoals ik het bedoel) kan terugvinden.
ik wil namelijk een rowspan in een div terug laten komen, als ik hierna ga zoeken op google, krijg ik allemaal tabellen in divs gemaakt, maar dat is niet mijn bedoeling.
Ik wil d.m.v. divs een bepaalde div achter twee andere plaatsen, waarbij die twee de zelfde hoogte hebben als de achterste div (fixed height)
oftewel dit tabel omgezet in divs maar dan niet werkend met een <div class="table"> etc.
Onderstaand tabel geeft de layout weer, en de id's komen overeen met de gewenste id's in de divs, verder de hoogte etc komt uiteindelijk uiteraard in de css te staan.
<table width="1000px" height="250px" border="1" id="home-services">
<tr>
<td width="700" id="home-services-head">home services head</td>
<td width="300" id="home-services-img" rowspan="2">Home service IMG WxH 250 x 250</td>
</tr>
<tr>
<td width="700" id="home-services-text">home services text</td>
</tr>
</table>
Zou iemand mij kunnen helpen?
want ik kom niet verder dan 2 divs langs elkaar en dan eentje onder beide over de gehele lengte.
Naar mijn verwachting zal
home-services-head & home-services-text een float left krijgen en home-services-img een float right,
de opzet zoals ik hem nu heb:
<style type="text/css">
#services-columns{
width: 1000px;
position: relative;
border: 1px solid black;
}
#services-head {
float: left;
width: 700px;
height: 32px;
border: 1px solid black;
}
#services-text {
float: left;
width: 700px;
height: auto;
border: 1px solid black;
}
#services-img {
float: right;
width: 300px;
height: 200px;
border: 1px solid black;
}
</style>
<div id="service-columns">
<div id="services-head">services head</div>
<div id="services-text">services text</div>
<div id="services-img">services img</div>
</div>
Toon Meer
Echter wil dit niet helemaal werken zoals hierboven in het table gedeelte.
Wie kan mij helpen & direct ook nog iets leren, zodat ik het de volgende keer zelf kan?