How to move a div element?

How to move to the right div element or any other element.

Solution: add block property.

<!DOCTYPE html>
<html lang="en">
  <head>
    <title>css Tips and Tricks</title>
      <link href="css/style.css" rel="stylesheet" />
  </head>
  <body>
    <div id="div1">Center this sentence.</div>
  </body>
</html>

Save this file as, for example, css-tricks.html, in your css-tricks folder. 

HTML and CSS - Creating lists

Seventh video lesson - how to create lists.

HTML and CSS - Basic table

Sixth video lesson - how to create a very basic table/

HTML and CSS - Add google fonts

Fifth video lesson - how to add google fonts to a web page.

HTML and CSS - CSS styles

Fourth video lesson - CSS styles.

HTML and CSS - Formatting tags

Third video lesson - formatting HTML tags.

HTML and CSS - Basic tags

Second video lesson - basic tags in HTML.

HTML and CSS - Web page structure

This is first video out of 7 about HTML and CSS.

First - introduction video.

Web page structure

Kreiranje tabele 2 - kako promeniti boju pozadinu reda kada se misem predje preko (Creating table 2 - how to change the background color of raw when you hover over)

Pitanje: Kreiranje tabele 2 - kako promeniti boju pozadine reda kada se misem predje preko?

Resenje: svojstvo: hover.

Primer :

HTML kod - opcija 1

<!DOCTYPE html>
<html>
<head>
<title>Kako da napravite tabelu 2</title>

<meta charset="UTF-8"/>
<meta name="description" content="Description that search reads" />
<meta name="keywords" content="page keywords, keywords" />
<meta name="author" content="Marija Rikic">
<link rel="icon" type="image/png" href="images/favicon.jpg">
<link rel="stylesheet" type="text/css" href="style.css">
</head>

Kreiranje tabele 1 - svaki drugi red tabele razlicite boje (Creating table 1 - every second row of the table in color)

Pitanje: kreiranje tabele 1 - svaki drugi red tabele razlicite boje.

Resenje: klasa na elementu <tr> i svojstvo: background-color.

Primer:

HTML kod

<!DOCTYPE html>
<html>
<head>
<title>Kako da napravite tabelu 1</title>

<meta charset="UTF-8"/>
<meta name="description" content="Description that search reads" />
<meta name="keywords" content="page keywords, keywords" />
<meta name="author" content="Marija Rikic">
<link rel="icon" type="image/png" href="images/favicon.jpg">
<link rel="stylesheet" type="text/css" href="style.css">
</head>

Kako da napravite horizontalni navigacioni meni (How to create a horizontal navigation menu)

Pitanje: kako da napravite horizontalni navigacioni meni?

Resenje: podesavanjem elemenata li da budu u istom redu, pomocu svojstva display: inline.

Primer:

HTML kod

<!DOCTYPE html>
<html>
<head>
<title>Kako da napravite horizontalni navigacioni meni</title>

<meta charset="UTF-8"/>
<meta name="description" content="Description that search reads" />
<meta name="keywords" content="page keywords, keywords" />
<meta name="author" content="Marija Rikic">
<link rel="icon" type="image/png" href="images/favicon.jpg">
<link rel="stylesheet" type="text/css" href="style.css">
</head>

Kako da napravite navigacioni meni sa podnavigacijom (How to create a navigation menu with subnavigation)

Pitanje: kako da napravite navigacioni meni sa podnavigacijom?

Resenje: dodacemo ugnjezdenu listu i stilizovati boje, ivice i svojstva veza stavki te nove liste. 

Primer:

HTML kod

<!DOCTYPE html>
<html>
<head>
<title>Kako da napravite navigacioni meni sa podnavigacijom</title>

<meta charset="UTF-8"/>
<meta name="description" content="Description that search reads" />
<meta name="keywords" content="page keywords, keywords" />
<meta name="author" content="Marija Rikic">
<link rel="icon" type="image/png" href="images/favicon.jpg">
<link rel="stylesheet" type="text/css" href="style.css">
</head>

Simple website design and code-Part 3

In previous two articles we designed home page and we sliced it and now we are going to code it.

Step 1 - Setting up files and folders

You are supposed to have folder first-website. In that folder you have another folder images, with images from previous article and first-website - Copy.xcf file. 

Rename this file to first-website.xcf. 

Open this file in GIMP, we'll need to pick up fonts, colors... In your first-website folder add two files - index.html and style.css. Open the editor of your choice, press CTRL+N twice to create new files. 

Kako postaviti pozadinsku sliku sa iseckom slike (How to set background image with slice image)

Pitanje: kako postaviti pozadinsku sliku sa iseckom slike?

Resenje: svojstva background i background-repeat.

Primer:

HTML kod

<!DOCTYPE html>
<html>
<head>
<title>Pozadinska slika sa iseckom slike</title>

<meta charset="UTF-8"/>
<meta name="description" content="Description that search reads" />
<meta name="keywords" content="page keywords, keywords" />
<meta name="author" content="Marija Rikic">
<link rel="icon" type="image/png" href="images/favicon.jpg">
<link rel="stylesheet" type="text/css" href="style.css">
</head>

Kako da promenite ili uklonite znakove za nabrajanje (How to change or remove bullets)

Pitanje: kako da promenite ili uklonite znakove za nabrajanje?

Resenje: svojstvo list-style-type.

Primer:

HTML kod

<!DOCTYPE html>
<html>
<head>
<title>Kako da promenite ili uklonite znakove za nabrajanje</title>

<meta charset="UTF-8"/>
<meta name="description" content="Description that search reads" />
<meta name="keywords" content="page keywords, keywords" />
<meta name="author" content="Marija Rikic">
<link rel="icon" type="image/png" href="images/favicon.jpg">
<link rel="stylesheet" type="text/css" href="css/style.css">
</head>

Kako da dobijete sva velika ili sva mala slova u tekstu (How to get all the capital or lowercase letters in the text)

Pitanje: kako da dobijete sva velika ili sva mala slova u tekstu?

Resenje: svojstvo text-transform.

Primer:

HTML kod

<!DOCTYPE html>
<html>
<head>
<title>Kako da dobijete sva velika slova u tekstu</title>

<meta charset="UTF-8"/>
<meta name="description" content="Description that search reads" />
<meta name="keywords" content="page keywords, keywords" />
<meta name="author" content="Marija Rikic">
<link rel="icon" type="image/png" href="images/favicon.jpg">
<link rel="stylesheet" type="text/css" href="css/style.css">
</head>

Kako da promenite visinu teksta izmedju redova (How to change the height of the text between the lines)

Pitanje: kako da promenite visinu teksta izmedju redova?

Resenje: svojstvo line-height.

Primer:

HTML kod

<!DOCTYPE html>
<html>
<head>
<title>Kako da promenite visinu teksta izmedju redova</title>

<meta charset="UTF-8"/>
<meta name="description" content="Description that search reads" />
<meta name="keywords" content="page keywords, keywords" />
<meta name="author" content="Marija Rikic">
<link rel="icon" type="image/png" href="images/favicon.jpg">
<link rel="stylesheet" type="text/css" href="css/style.css">
</head>

CSS: Fade in neon glow tekst efekat (Fade in neon glow text effect)

HTML kod

<!DOCTYPE html>
<html>
<head>
<title>CSS: Fade in neon glow tekst efekat</title>
<meta charset="UTF-8"/>
<meta name="description" content="Description that search reads" />
<meta name="keywords" content="page keywords, keywords" />
<meta name="author" content="Marija Rikic">
<link rel="icon" type="image/png" href="images/favicon.jpg">
<link rel="stylesheet" type="text/css" href="css/style.css">
<script type="text/javascript" src="js/jquery-1.11.3.js"></script>
<script>
$(document).ready(function() {
$('body').hide().fadeIn(5000);
});
</script>
</head>

Kako da podvucete naslove (How to create underline for headings)

Pitanje: kako da podvucete naslove?

Resenje 1: svojstvo text-decoration.
Resenje 2: svojstvo border-bottom.

Primer 1: ako koristite svojstvo text-decoration, boja podvucenog naslova bice ista kao i boja fonta.

HTML kod

<!DOCTYPE html>
<html>
<head>
<title>CSS - Kako da podvucete naslove</title>

<meta charset="UTF-8"/>
<meta name="description" content="Description that search reads" />
<meta name="keywords" content="page keywords, keywords" />
<meta name="author" content="Marija Rikic">
<link rel="icon" type="image/png" href="images/favicon.jpg">
<link rel="stylesheet" type="text/css" href="css/style.css">
</head>

Kako da obojite pozadinu naslova (How to add a background color to a heading)

Pitanje: kako da obojite pozadinu naslova?

Resenje: svojstvo background-color.

Primer:

HTML kod

<!DOCTYPE html>
<html>
<head>
<title>Kako da obojite pozadinu naslova</title>

<meta charset="UTF-8"/>
<meta name="description" content="Description that search reads" />
<meta name="keywords" content="page keywords, keywords" />
<meta name="author" content="Marija Rikic">
<link rel="icon" type="image/png" href="images/favicon.jpg">
<link rel="stylesheet" type="text/css" href="css/style.css">
</head>