login  Naam:   Wachtwoord: 
Registreer je!
 Forum

Nieuwsberichten in div's (Opgelost)

Offline sanderrebry - 16/07/2013 11:29
Avatar van sanderrebryLid Op de homepagina van een website heb ik blokken (div's) telkens per twee staan in één rij. (zie voorbeeld: http://www.demuynck-printing.be)
Momenteel wordt dit in het cms-systeem via wysiwyg met tabellen opmaak verzorgd.
Dit lijkt nogal omslachtig om dit telkens met tabellen op te maken en zou dit via een nieuwsberichten module laten werken.
Dit is mij al in zeker zin goed gelukt, alleen is het probleem dat deze nu allemaal naast elkaar komen i.p.v in één rij max. twee nieuwsitems naast elkaar(zoals voorbeeld)
Hoe kan ik dit laten automatiseren ?


html4strict code - Bekijk de code zonder highlighting - Klap code in 
  1. <div class="art-postcontent art-postcontent-0 clearfix">
  2. <div class="art-content-layout-wrapper layout-item-0">
  3. <div class="art-content-layout layout-item-1">
  4. <div class="art-content-layout-row">   <div class="art-layout-cell layout-item-2" style="width: 50%">
  5. EERSTE BLOK
  6. </div>
  7. <div class="art-layout-cell layout-item-2" style="width: 50%">
  8. DIT IS DE TWEEDE BLOK DIE NAAST DE EERSTE BLOK KOMT
  9. </div>
  10. <div class="art-layout-cell layout-item-2" style="width: 50%">
  11. DIT IS DE DERDE NIEUWSBLOK DIE ERONDER MOET KOMEN
  12. </div>
  13. <div class="art-layout-cell layout-item-2" style="width: 50%">
  14. DIT IS DE VIERDE NIEUWSBLOK DIE ERNAAST MOET KOMEN
  15. </div>
  16. </div>
  17. </div>
  18.  </div>
  19.     </div>


In de nieuwsberichten module kan in instellingen gaan plaatsen:
Header:
<div class="art-postcontent art-postcontent-0 clearfix">
<div class="art-content-layout-wrapper layout-item-0">
<div class="art-content-layout layout-item-1">
<div class="art-content-layout-row">

Bericht "Loop":
<div class="art-layout-cell layout-item-2" style="width: 50%">
[SHORT]
</div>

</div>
</div>
</div>
</div>

Zie voorlopig voorbeeld: http://studiowebvision.be/demuynck/pages/home.php

Dit is de css dit werkt met table layout in css

css code - Bekijk de code zonder highlighting - Klap code in 
  1. .art-layout-wrapper
  2. {
  3.    position: relative;
  4.    margin: 0 auto 0 auto;
  5.    z-index: auto !important;
  6.  
  7. }
  8.  
  9. .art-content-layout
  10. {
  11.    display: table;
  12.    width: 100%;
  13.    table-layout: fixed;
  14.    border:solid thin black;
  15. }
  16.  
  17. .art-content-layout-row 
  18. {
  19.    display: table-row;
  20.   border:solid thin black;
  21.  
  22. }
  23.  
  24. .art-layout-cell
  25. {
  26.    display: table-cell;
  27.    vertical-align: top;
  28.  
  29. }


Weet iemand hier raad mee?

1 antwoord

Gesponsorde links
Offline dennissites - 21/09/2013 20:39 (laatste wijziging 21/09/2013 20:46)
Avatar van dennissites Nieuw lid Geef ze gewoon een clear:both;, clear:left; of clear:right;


Gewoon dit toevoegen dus

css code - Bekijk de code zonder highlighting - Klap code in 
  1. .art-layout-cell layout-item-2 { clear: both;}
Gesponsorde links
Je moet ingelogd zijn om een reactie te kunnen posten.
Actieve forumberichten
© 2002-2024 Sitemasters.be - Regels - Laadtijd: 0.198s