2 DIV Container bei geringer Seitenbreite untereinander

[Manuelw]

Hallo!

Ich erstelle gerade für Joomla ein Responsives Template.

In diesem Template werden auf der Hauptseite 2 Div Boxen nebeneinander angeordnet. In diesen Boxen sollen Links die neuesten Nachrichten per Modul angezeigt werden und in der Rechten ein Bild oder Video einer Webcam.

Am PC ist die Darstellung so wie ich es mir vorgestellt habe (nebeneinander), jedoch möchte ich, dass wenn die Seite auf einem Mobilgerät mit kleinerem Display angezeigt wird, sich diese 2 Divs so verschieben, dass sie untereinander Angezeigt werden.

Derzeit gehen sie zwar mit der Seitenbreite mit, jedoch verringert sich bei beiden nur die DIV Breite.

Könnt Ihr mir sagen, wie ich diese untereinander bekomme?

Der html Code in der Seite sieht wie folgt aus:

<div class="zeile clearfix">  
			<div class="links"><jdoc:include type="modules" name="box_left" style="xhtml" /></div>  
	  		<div class="rechts"><jdoc:include type="modules" name="box_right" style="xhtml" /></div>  
		</div>

Und der dazugehörige CSS Code sieht so aus:

.zeile {  
margin: 0 auto;  
max-width: auto;  
}  
  
.links {  
float:left;  
width: 70%;  
}  
  
.rechts {  
float:left;  
width: 30%;  
}  
  
.clearfix {  
*zoom: 1;  
}  

L.G.
Manuel

[Gunnar Bittersmann]

@@Manuelw:

nuqneH

Könnt Ihr mir sagen, wie ich diese untereinander bekomme?

Wie Ethan Marcotte in der Mutter aller Artikel sagte:

Responsive web design =
[✓] fluid grid
[✓] flexible media
[ ] media queries

Ich hab mal abgehakt, was du schon erfüllt hast.

Qapla'