CODEWITHSUNDEEP
csstypo3typoscripttypo3-8.x
bautista
bautista

Reputation: 794

How to change the font of a form created in typo3 8.7?

Im absolutely new to typo3 and want to set up a simple contact form. So I created a form and added it to the page. My template record looks like this: 

page = PAGE
page.typeNum = 0
page.10 < styles.content.get
page.includeCSS {
  file1 = fileadmin/templates/css/style.css
}

I can see the form and it works appropriately, but unfortunately my css doesnt do anything.

My style.css looks like this:

p {
    font-family: arial;
    font-size: 120px;
}

Gotta admit i have no knowledge about CSS too. The changes I made had absolutely no impact on my page. Do these infos help you by any chance? I just have no idea how to fix it on my own, been searching for a solution all day long.

Upvotes: 0

Views: 215

Answers (4)

Stefan Padberg
Stefan Padberg

Reputation: 527

You should define the styling of the input fields seperately. With some browsers the inheritance from the body tag definitions seem not to work.

input, textarea { font-size:1.25em; font-family:serif; border:1px solid darkgray; }

Something like that.

Upvotes: 0

Stephan Grass
Stephan Grass

Reputation: 132

120px will result in a really big font ;-)

Set the style-definition to the body-tag (so for all elements below the body), not only for the p. 

body {
  font-family: Arial, sans-serif;
  font-size: 12px;
}

Upvotes: 1

Jonas Eberle
Jonas Eberle

Reputation: 2921

Your style.css should only contain this:

p {
  font-family: arial;
  font-size: 120px;
}

... and you'll see the difference ;)

Probably only a copy&paste error, but your TypoScript (aka template record) has spaces where it shouldn't:

...
file1 = fileadmin/templates/css/style.css
...

Upvotes: 1

Bernd Wilke πφ
Bernd Wilke πφ

Reputation: 10790

you should learn more about the structure of CSS-files. maybe you inspect some with your browser from other sites.

Then you will notice it is something like:

p {
    font-family: arial; 
}

For file pathes in typoscript or objects and attributes: don't insert spaces:

:
page.10 < styles.content.get
page.includeCSS {
    file1 = fileadmin/templates/css/style.css
}

Upvotes: 1

Related Questions