Navigatie staat onder elkaar in plaats van naast elkaar.

Beste mensen,
Bij het omzetten van een Joomla 2.5 site naar Joomla 3.6 loop ik tegen een raar fenomeen aan wat ik bij andere site sie ik heb omgezet nog niet ben tegengekomen. De navigatie onderaan een nieuwsblog staat onder elkaar en niet naast elkaar. Ik heb al flink zitten googlen maar de 'oplossingen' die ik daarbij gevonden heb werken niet bij deze website. Een voorbeeld is hier www.heiligethomas.nl/nieuws nieuw.heiligethomas.nl/nieuws te zien. Het template wat ik gebruik is beez, maar dan aangepast aan mijn eigen voorkeuren. Dit is hetzelfde template wat ik ook bij andere sites gebruik. En daar staat de navigatie wel netjes naast elkaar. Wat doe ik hier verkeerd?
Met vriendelijke groet,
Ronald

Voeg aan je personal.css het volgende toe:

Hallo RVdwbd,

Hartelijk dank voor jou snelle reactie!
De lay-out is inderdaad door deze toevoeging aangepast. 'Start', 'Vorige' enz. staan nu naast elkaar in plaats van onder elkaar. Toch doet zich een raar fenomeen voor.
Als ik jouw code in een eigen css-file, die ik als override gebruik, plak wordt de lay-out niet aangepast. Als ik de code in personal.css plak wel. En mijn 'overide-css' wordt wel ingelezen. Dat zie ik aan andere aanpassingen.
Daarnaast staan de navigatie-woordjes in kadertjes en staat 'Start' iets lager. Bij mijn andere sites staan alle navigatiewoordjes netjes naast elkaar zonder kadertjes. Misschien ben ik aan het muggenziften. Maar ja, het intrigeert mij.... .
Met vriendelijk groet,
Ronald

Het is niet echt een raar fenomeen. Het heeft te maken met de volgorde waarin de css wordt geladen. De laatste geladen code zal in de pagina worden weergegeven. Er is echter een simpele oplossing: zet bij de code in de eigen css-file achter display:inherit !important; hierdoor zal deze code als laatste gezien worden. Het verhaal over start kan ik totaal niet volgen.

Start staat lager door deze code in layout.css regel 838 Die overruled de paddin op regel 820 van lay-out.css je kan dit oplossen door in personal.css een regel op te nemen.

De border komt uit bootstrap.min.css Deze staat echter na personal.css maar waarschijnlijk lukt het wel om deze regel te overrulen door hem in personal.css extra te kwalificeren met #main

Er is echter een simpele oplossing: zet bij de code in de eigen css-file achter display:inherit !important; hierdoor zal deze code als laatste gezien worden.

Nu wordt inderdaad de ccs uit de override genomen. Bedankt!
Met vriendelijke groet,
Ronald

Code:

#main .pagination ul > li > a, #main .pagination ul > li > span { border: none; }

Hallo BramWaas,
Het aanpassen van de css in personal.css heeft de lay-out niet gewijzigd. Nog steeds staat 'Start' iets lager. Als ik op 'Einde' klik staat 'Start' weer wel gelijk. Raar.
Met vriendelijke groet,
Ronald

Ik zie onderstaande de regel niet in personal.css , maar het is wellicht handiger als je zelf het element inspecteert (in firefox, of chrome op de "start" link gaan staan en uit het rechtermuismenu inspecteren klikken.
Dan zie je welke css actief is. Deze css kopieren naar personal.css en dan aanpassen zoals je wilt en opnieuw in inspector kijken, of je aanpassing gebruikt wordt.
Eventueel kan je in inspector ook regels uitschakelen door het vinkje weg te halen voor de regel, dan zie je sneller wat de boosdoener is.

Deze in de personal.css op regel 17 aanpassen en dan moet start gelijk staan met de rest.

Offtopic:
@Bramwaas
Tip: de code kun je bij wijze van experiment ook in de inspector aanpassen en kijken was er gebeurd. Hoef je niet telkens te switchen van code naar browser en weer terug.