Lejjeb csuszott a kép mi a megoldás?
A kódról és az eredményről tudnál képet küldeni?
Így elég nehéz lesz segíteni, ha nem látjuk a problémát.
képet hogy tudok küldeni? A kód az itt van <html>
<head>
<meta charset="UTF-8">
<title>Étterem</title>
<link href="style.css" rel="stylesheet">
<link rel="stylesheet" href="banner.css">
</head>
<head>
<link href="style.css" rel="stylesheet">
<link rel="stylesheet" type="text/css" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css">
</head>
<body>
<div class="wrapeer">
<header>
Étterem
</header>
</div>
<div class="content">
<nav>
<ul>
<li><a href="eloetel.html">Előételek</a></li>
<li><a href="foetel.html">Főételek</a></li>
<li><a href="levesek.html">Levesek</a></li>
<li><a href="Salatak.html">Saláták</a></li>
<li><a href="desszert.html">Deszertek</a></li>
<li><a href="vegetarianus.html">Vegetáriánus ételek</a></li>
<li><a href="turmix.html">Turmixok</a></li>
<li><a href="koret.html">Köretek</a></li>
<li><a href="savanyusag.html">Savanyúság</a></li>
<li><a href="elerhetoseg.html">Elérhetőség</a></li>
</ul>
</nav>
<br>
<br> <br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br>
<div class="picture">
<img src="kinai.jpg" alt="kinai">
<img src="teszta.jpeg" alt="teszta">
<img src="spagetti.jpeg" alt="spagetti">
<img src="hamburger.jpeg" alt="hamburger">
<img src="rantotthus.jpeg" alt="rántott hús krumplival">
</div>
</main>
</div>
</div>
</body>
</html>
*{
box-sizing: border-box;
margin: 0px
}
body{
margin: 0px;
padding: 0px;
font-family: Arial;
}
header{
font-family: Arial;
background: url('body.jpeg') no-repeat;
text-align: center;
font-size: 75px;
padding: 20px 14px;
position:relative;
margin: auto;
width: 1903px;
height: 270px;
}
body{
font-family:Arial;
}
.wrap{
position:absolute;
width:30%;
top:50%;
left:50%;
transform: translate(-50%,-50%);
text-align: right;
left: 1800px;
top:100px
}
}
.wrapper{
max-width: 1200px;
margin: 0 auto;
}
.content{
background: url(body.jpg);
}
.content::after{
content:"";
clear: both;
display: table;
}
nav{
width: 25%;
float: left;
width: 240px;
}
nav ul{
margin: 0px;
padding: 30px;
list-style: none;
background-color:#368ABB;
height:843px;
}
nav ul li{
border-bottom: 1px dashed rgba(255,255,255,2);
list-style: none;
}
nav a {
color: white;
text-decoration: none;
padding: 15px 0;
display: block;
}
nav a:hover{
padding:15px;
background:rgba(255,255,255,.1);
}
main{
width:75%;
background: url(body.jpg);
float:left;
text-align:center;
color: green;
gyakorló weboldal
Képet úgy tudsz küldeni, hogy feltöltöd kepkuldes,com-ra, például.
Egyébként átnéztem a kódot, rengeteg helyen hibás.
Például: miért van két head tag?
Esetleg a képeket is feltölthetnéd külön, hogy letölthessük, mivel ezek nekünk nyilván nincsenek meg.
Na igen, a másik a sok br tag használata. Pont az lenne a lényeg, hogy CSS-t használva toljuk a tartalmat, ne pedig azzal, hogy a br tageket kezdjük veszettül irkálni.
Ez arra emlékeztet, mikor a hülye gyerek szövegszerkesztő programban (mondjuk MS Word-ben, vagy Libre Word-ben) elkezdi nyomkodni az Entert, mert lejjebb akarja tenni a szöveget. Nemhogy a bekezdések távolságát növelné meg.
Szóval a br tagek helyett használd a margin beállítást CSS-ben.
Egyébként nem a cyrex.hu tanfolyamáról csinálod ezt az oldalt?
Ott is egy receptes oldalt csinált Tamás, és ilyen kaják képeit rakta hozzá.
Kapcsolódó kérdések:
Minden jog fenntartva © 2024, www.gyakorikerdesek.hu
GYIK | Szabályzat | Jogi nyilatkozat | Adatvédelem | Cookie beállítások | WebMinute Kft. | Facebook | Kapcsolat: info(kukac)gyakorikerdesek.hu
Ha kifogással szeretne élni valamely tartalommal kapcsolatban, kérjük jelezze e-mailes elérhetőségünkön!