Hallo allemaal,

Ik heb even een CSS probleempje waar ik zelf niet helemaal goed uitkom. Ik ben zelf een Wordpress template aan het bouwen via Bones. Nu heb ik een standaard Template met Sidebar.

Stylesheet van deze normale template is de volgende:
#content {
margin-top: 1.5em; }


Nu zat er nog een sjabloon in genaamd; Custom Page Example, hier wil ik graag de sidebar uithalen. Het doel is om volledige pagina breedte tot de SideBar te krijgen. Dus eigenlijk de ruimte van de SideBar ook nog te kunnen benutten met tekst etc.

Wat ik tot nu toe heb gedaan:

Nu heb ik in de Php code de SideBar verwijdert; <?php get_sidebar(); ?>

Daarna de StyleSheet aangepast naar; <div id="content-fullwidth">

Tot zover lukte alles nog, heb dit ook gevonden via een soort van Tutorial. Maar nu komt het probleem.

Ik ga naar de stijl van:
<div id="content-fullwidth">

Vervolgens pas ik hem aan:
#content-fullwidth {
margin-top: 1.5em;
margin-left: 450px;
width: 900px;
}

Hij is aan de linkerkant gewoon netjes uitgelijnd zoals ik wil, Margin-Top heb ik gepakt vanuit de standaard template zodat het er in deze template hetzelfde uitziet. Nu pakt de template de pagina wel op de computer maar Responsive pakt die hem niet, als ik mijn browser verklein is de tekst gewoon helemaal weg. Als ik andere pagina's verklein met de normale template pakt die hem gewoon netjes Responsive.

Heb al van alles geprobeerd;
Margin-Left weggelaten --> Werkt niet (Tekst staat helemaal links van pagina uitgelijnd, als het ware tegen de zijkant maar moet onder mijn menu)
Margin-Left: auto; --> Werkt ook niet (Linkerkant staat ineens middenin)

Hoe kan ik ervoor zorgen dat alles netjes zoals mijn standaard template staat uitgelijnd, en ook Responsive goed werkt?

Op de volgende manier staat de tekst goed uitgelijnd onder mijn menu, alleen werkt de volledige breedte dus niet. Dit is eigenlijk de normale template (Normaal dus met SideBar):

#content-fullwidth {
margin-top: 1.5em;
}



Ik hoop dat er iemand mij kan helpen, kom er zelf echt niet meer uit!

Kan je de template online zetten zodat we je code kunnen bekijken?

Als je "#content-fullwidth" zelf heb aangemaakt, moet je natuurlijk ook voor responsive de ID goed definiëren vooral omdat je een vaste maat gebruikt van 900px, maakt daar eens 100% van en kijk wat het doet.

Origineel gepost door Arno Tenkink

Als je "#content-fullwidth" zelf heb aangemaakt, moet je natuurlijk ook voor responsive de ID goed definiëren vooral omdat je een vaste maat gebruikt van 900px, maakt daar eens 100% van en kijk wat het doet.

Werkt helaas niet. Weet wel zeker dat ik in de goede stylesheet etc zit want andere aanpassingen zoals Width: 900px; etc pakt die wel, alleen de breedte van de pagina krijg ik gewoon maar niet goed!

width: 900px !important; werkt ook niet? Er is ook meestal nog een code die de CSS aanpast wanneer het scherm kleiner als xx px is. Daar kan het ook nog verkeerd staan.

Kun je niet gewoon de volledige code van de full width template gebruiken?