Tweet
Lay-out uit de pas
Puzzelen bij slecht weer 
Zoiets was dit. Ik zag nl. dat in mijn testblog er bij berichten waar nog een "Verder Lezen" mogelijkheid onder zat de lay-out uit de pas liep. Tja hoe los je dat nu op?
Update: ik heb deze posting geupdated, aangezien de informatie die ik hieronder vermeldde niet correct is.
CSS knutselen
Met behulp van de Webdeveloper Toolbar in Firefox met daarin de mogelijkheid je CSS (waarmee je de layout dus bepaalt) te bekijken kwam ik er achter dat er ergens een foutje zat in de standaard templates die geinstalleerd worden bij de stijl. Daarvoor heb ik in de Information sectie in de developer toolbox de optie div order aangezet. Want dan zie je de verwijzingen naar allerlei zaken die in die CSS file staan.
class="asset-more" moet zijn class="asset-more-link"
En toen zag ik dat er bij er een verkeerde verwijzing staat in de template Bericht. Zo staat daar bij extended entry nl. class=asset-more en in de CSS class="asset-more-link" en dat is toch wel een verschil. Onder .asset-more-link staat nl. precies aangegeven hoe de layout moet zijn. En tja als je de verwijzing naar dat stukje niet correct neerzet wordt ie ook niet gevonden.
Dus even de verwijzing asses-more aangepast naar asset-more-link en daarna stond alles keurig in het gelid.
Zo nu weet ik zelf wat ik gedaan heb en kunnen anderen er wellicht ook iets mee. Ik hoop tenminste dat het dit was
Recap
In template Bericht (of Entry), net voor <$MTEntryMore$> moet je:
<div id="more" class="asset-more">
veranderen in:
<div id="more" class="asset-more-link">
Het blijkt in heel iets anders te zitten. Toen ik mijn testblog opnieuw publiceerde was de layout niet goed. Het blijkt dat in de CSS file van Mid-century stijl de asset-more tag niet is gedefinieerd. Daardoor wordt dus na de “verder lezen knop” of “Continue Reading” of “More” de layout niet goed weergegeven. Onderstaande blokken dienen aangepast te worden. De asset-more tag wordt er in gedefinieerd zoals je ziet. Het grootste gedeelte staat al in de screen.css file. De asset-more opties zijn toegevoegd.
.entry-asset .asset-body,
.page-asset .asset-body,
.entry-asset .asset-more {
margin-left: 55px;
padding-top: 5px;
font-family: Georgia;
font-size: 13px;
margin-bottom: 10px;
}
.asset .asset-body p,
.asset .asset-body blockquote,
.asset .asset-body ul,
.asset .asset-body ol,
.asset .asset-more p,
.asset .asset-more blockquote,
.asset .asset-more ul,
.asset .asset-more ol {
margin-bottom: 15px;
}
.entry-asset .asset-body blockquote,
.entry-asset .asset-more blockquote {
margin: 0 25px 15px 25px;
padding-left: 15px;
color: #333;
border-left: 1px dotted #ddddd9;
}
.entry-asset .asset-body ul,
.entry-asset .asset-body ol,
.entry-asset .asset-more ul,
.entry-asset .asset-more ol {
list-style: disc;
margin-left: 25px;
Ook interessant om te lezen:
- Herstel, het was een ander foutje in CSS Mid-century
Afgelopen dinsdag schreef ik een posting over een fout in de CSS van Mid-century template set van Movable Type 4.25. De extended entry layout (het...
- Prettige Paasdagen!
Even gas terug! Lekker uitrusten, wandelen, paaseieren zoeken. Kortom: familie en geen blogs.Prettige Paasdagen gewenst!...
- Het meest gelezen artikel in Furl
Mijn posting van 20 januari. Het interview hieronder is het meest gelezen in mijn Furl archief. Ruim 160x. Interview Rolf Jensen Ik heb een mooi...
- You and Context
28 februari 2005 You and Context Na het schrijven van de postings over Open Source Marketing, Social Customer Manifesto, The Cluetrain Manifesto en Context Rules...
- links for 2007-01-23
53 CSS-Techniques You Couldn’t Live Without | Smashing Magazine Interessante verzameling css templates via enthousiasmeren.nl (tags: css webdesign techniques Design)...
