My CSS code didn't work

Curriculum Help
,
1

Yesterday I learnt here how to make a class (something like .xxxx { background-color: silver; } xxx is called class, I guess) and background-color. I tried to use background-color but didn’t work. Nothing changed in the web page.

Here is what I did:
Created style tag in html document
I wrote

.arkaplan {
background-color: silver;
}

Later created div tag
I nested all my form and its lists into div tag
Next, changed div code like that <div class="arkaplan">

I expected the whole form’s background-color switch from white to silver but nothing changed.

Here is whole html codes:

<DOCTYPE html>
<!-- li'nin fontu comic sans olmalı 
border-mavi yapamadık neden ki?
-->
<link href="https://fonts.googleapis.com/css?family=Lobster" rel="stylesheet" type="text/css">
<style>
	.ortabuyuk {
	width: 250px;
	}
	h1 {
	color:red;
	font-size:26px;
	font-family:Lobster;
	}
	li {
	font-family: Times New Roman;
	}
	h4 {
	font-family: Times New Roman;
	.border-mavi {
	border-color: blue;
	border-width: 10px;
	border-style: solid;
	}
	.arkaplan {
	background-color: silver;
	}
	
	</style>
<head>
	<title>Güncel Sözdizim  Tartışmaları</title>
</head>
<body>
<div class="arkaplan">
<img class="ortabuyuk border-mavi" src= "http://www.mrmediatraining.com/wp-content/uploads/2011/01/Question-Man_thumb.jpg">
	<h1>Güncel Sözdizim Tartışmaları ve Soruları</h1>
	<ul>
	<li>Söz terimini sadece ağzımızdan çıkan sözcüklerin oluşturduğu yapılar için mi kullanırız? Örneğin yazılı metin veya yazıya dökülmüş konuşma da birer söz müdür?</li>
	<li>Kabuledilebilir olmayan tümcelerden oluşan sözlere, söz terimini kullanabilir miyiz? Söz olmak için kabuledilebilirlik şart mıdır?</li>
	<li>Tümce kullanımı ile söz aynı şey midir? Değilse farkı nedir? (use of sentence) </li>
	<li>Farklı günlerde söylenen "bugün hava çok sıcak" tümceleri farklı önermeler midir?</li>
	<li>Kabul edilebilirlik kimi zaman oznel bir yargı ifade eder mi?</li>
	<li>Kabul edilebilirlik  kavramında üçüncü durumu dünya bilgisi kaynaklı mı diyeceğiz yoksa bağlam kaynaklı mı?</li>
	<li>Word Order'ın Türkçe karşılığı için sözcük dizimi diyebilir miyiz? İlgili Türkçe bir terim literatürde var mı?</li>
	<li>9, 10 ve 11. örneklerdeki sorun nedir? Parsing teriminin anlamı nedir?</li>
	</ul>	
<h4>Soruların Cevabını Biliyor Musunuz?</h4>
<form action="#">
<!-- type olarak checkbox da eklenebilir, çoklu seçenek istersek -->
<label for="Evet">
	<label><input id="Evet" type="radio" name="evet-hayir" required>Evet</label>
<label for="Hayır">
	<label><input id="Hayır" type="radio" name="evet-hayir" required checked>Hayır</label>
	<input type="text" placeholder="Soru Ekle" required>
	<button type="submit">Gönder</button>
</form>
</div>
</body>
2

I’ve edited your post for readability. When you enter a code block into a forum post, please precede it with a separate line of three backticks and follow it with a separate line of three backticks to make easier to read.

See this post to find the backtick on your keyboard. The “preformatted text” tool in the editor (</>) will also add backticks around text.

Note: Backticks are not single quotes.

markdown_Forums

3

You need to specify rules for the form elements, they don’t automatically inherit.

input {
  background-color: inherit;
}

Should do it, or set the background colour to transparent, or however you want to do it. Browsers will use their own styling for elements, you need to be quite specific with them if you want to override it.

4

I am sorry I could not write the codes in the right way. I am learning coding for my university project so ı am amateur for these things :frowning:

I will add things you wrote in my html project when I come home in the evening. I am so excited :smiley: Thank you so much!

5

I put that you wrote but it still doesn’t work.

‘’’
.arkaplan {
background-color: silver;
}
input {
background-color: inherit;
}

Güncel Sözdizim Tartışmaları
'''
7

Indent your code, and put spaces between things, it’s much easier to see when you’ve made mistakes:

.ortabuyuk {
    width: 250px;
}

h1 {
    color:red;
    font-size:26px;
    font-family:Lobster;
}

li {
    font-family: Times New Roman;
}

/* Here is the error: */
h4 {
    font-family: Times New Roman;

.border-mavi {
    border-color: blue;
    border-width: 10px;
    border-style: solid;
}

.arkaplan {
    background-color: silver;
}

Anyway, if you fix that, adding backhground-color: inherit to input elements gives me:

Screenshot%20from%202018-11-21%2017-42-07

Buttons you also need to amend if that’s what you want, and you need to adjust borders etc. - forms elements are not terribly easy to style, I would use Google here because there are a lot of gotchas for each type of thing.

8

Finally!! Thank you so much!!! I can’t explain how much ı am happy now. ı was so confusing couldn’t find the problem.

I actually just want to practice for what I learn here. I learnt background color code so tried to use it. It doesn’t look so good but it’s okay now ı can use that tag :))))). Step by step my practice html page will look better :)) I am so relived. You are awesome!