Contact pagina instellingen

[Saahstories]

Hallo,

Ik heb twee vragen over mijn contact pagina, 

- De gevraagde gegevens staan nu over de totale breedte van de pagina ik wil dit graag op zo'n 70% hebben staan.

- Hoe krijg ik het kopje contacformulier dikgedrukt en in het midden van het scherm

 De HTML codering is nu als volgt:

{% form 'contact' %}
{{ form_errors | default_errors }}

<div>Contactformulier<div>
<br>

<div>Heeft u een vraag vul dan ons contactformulier in en wij zullen u vraag binnen 24 uur beantwoorden.<div>
<br>

<div class="grid_item medium-op--one-half">
<label for="first-name">Naam:</label>
<input type="text" name="contact[first_name]" />
</div>

<div class="email">
<label for="email">E-mail:</label>
<input type="email" name="contact[email]" />
</div>

<div class="order-number">
<label for="order-number">Ordernummer:</label>
<input type="text" name="contact[order_number]" />
</div>

<div class="message">
<label for="message">Bericht:</label>
<textarea name="contact[body]"></textarea>
</div>

<div class="submit">
<input type="submit" value="Verstuur" />
</div>
{% endform %}

[PublicApps]

Ruimte of het formulier
Ik zou een <div> element om al jouw code heen zetten en daar een max-width op zetten met een margin.

Gebruik je toevallig het Boundless theme? Dan kun je de class 'page-width' gebruiken.

<div class="page-width">

...jouw code...

</div>

Werkt dit niet, dan zou je dit kunnen toevoegen:

<div style="max-width: 780px; margin: 0 auto; padding: 0 20px;">

...jouw code...

</div>

Kop contactformulier

Om het woord contactformulier dik te drukken kun je verschillende dingen doen:

Maak er een kop van:
<h1>Contactformulier</h1> of
<h2>Contactformulier</h2> of
<h3>Contactformulier</h3>

Of geen kop, maar puur dikgedrukt:
<div><strong>Contactformulier</strong></div>

Als je het Boundless theme gebruikt kun je de class text-center gebruiken om te centreren.

<h1 class="text-center">Contactformulier</h1>
...

of 

<div class="text-center"><strong>Contactformulier</strong></div>

Als class="text-center" niet werkt  om te centreren, gebruik dan style="text-align: center".