Hur ser övrig CSS ut (containern, boxarna som ger kalendern och sökningen m.m.)
Hur ser HTML-koden ut (i vilken ordning ligger divvarna du använder runt kalender, sökning, logglista m.m.)
vilken <!DOCTYPE kör du med?
Validerar din HTML-kod?
Validerar din övriga CSS-kod (den du visar upp är inte helt juste till att börja med )
Kort sagt - mer info behövs - utifrån det du visar upp kan vi nog i princip bara spekulera i att du kanske har en container som är såpass smal att kalendern + blogglistans summa av bredd,margin och padding inte får plats - vlket gör att blogglistan "rasar ner" under kalendern (den är ju en float)
Det och kombinationen att du inte angett enheter "px" på margins,paddings i din CSS, vilket kan göra resultatet oberäkneligt mellan olika webbläsare
Väljer du fel ser du till att besökarens webbläsare börjar emulera "uråldrigt felbeteende" (även kallat "ställer in sig för rendering i Quirks mode") och det ger bara trubbel iom att t.ex. beräkningarna av bredder av div-block sker lite olika i olika webbläsare då.
Det är lika illa att utelämna den! (vilket gör att de flesta moderna webbläsare får för sig att använda uråldrigt felbeteende istället för modern fungerande standard
Den där har jag råkat ut för också nån gång (det är inte <DOCTYPE som spökar värst i det här fallet)
Du har råkat blanda ihop två olika layoutmetoder lite bara.
Testa det här:
Slå ihop kalenderruta och sokruta till en div (du kan lägga en ny div (med rätt bredd) runt bägge och kalla den t.ex. sidspalt)
Flytta sedan float: left från .bloggruta till den nya hopslagna divven och ta bort position:relative från .bloggruta.
Huvudsaken är att du lägger en float-left-div med fast bredd först i koden, och därefter en "vanlig" div (icke-float) med en margin-left som är "större" än bredden på float-divven. (det såg ut i din kod som att det var den du höll på att komma fram till )