HTML-kódom miërt nem mükodik? Miért nyomja ki a div elem a képeimet?
Itt van egy kep a website-rol.
http://www.flickr.com/photos/95110983@N08/8660033568/
Na es ott van a header-picture-om. Az a "All about Social Networks" allat van es ez a kep kinyomja azokat a harom kis kicsi kepeket. Azt szeretnem ha azok a harom kepek (egy billenytus amin irnak) hogy azok ott legyenek a header-picture mellet. Sztem a header-pic div elem kinyomja azt a harom kepet. Itt a forraskod.
A harom kicsi kep: index1.jpg, index2.jpg, index3.jpg. Azt szeretnem ha az inderheaderpic.jog mellet legyen pont jobbra. ugyanabba a magassagba. koszi aki valaszol.
HTML:
<html>
<head>
<title>All About Social Networks</title>
<link href='http://fonts.googleapis.com/css?family=Bubblegum+Sans' rel='stylesheet' type='text/css'>
<link href='http://fonts.googleapis.com/css?family=Droid+Serif' rel='stylesheet' type='text/css'>
<link rel="stylesheet" type="text/css" href="styles.css">
</head>
<body>
<div id="wrapper">
<div id="header">
<div id="logo">
<h1>Social Networks</h1>
</div>
<div id="main-menu">
<ul>
<li><a href="#">About me</a></li>
<li><a href="#">Contact me</a></li>
<li><a href="#">Suggestions</a></li>
<li><a href="#">Results</a></li>
<li><a href="#">Problems</a></li>
<li><a href="#">Home</a></li>
</ul>
</div>
</div>
<div id="page">
<h1 id="header-text">All about Social Networks</h1>
<div id="header-pic">
<img src="images/indexheaderpic.jpg" alt="Social Networks">
<div id="main-content">
<p>Welcome to my website. This website talks about social networks and the problems these websites do have. Our website provides help for users to overcome these dangerous problems social networking ca cause if we are not careful. You can also find informations about the author of this website. If you have any questions or concerns about social sites such as Facebook, twitter or any social networks please feel free to contact me and I will try to response as soon as possible </p>
<p>The main subject of this website is the social networking. You can read about the problems and results that social networking causes and get suggestions to overcome these problems.</p>
<p>
The problem is that most teenagers spend critically much time on social sites such as Facebook, Twitter, Skype and Myspace. They may have more friends on one of these social networks than they do in real life. Millions of people around the world with access to the internet are members of one or more social networks. It may be one of the reasons why a lot of teenagers fail in exams recently. They spend hours to check their friends's stage or upgrading their profile picture. They share information with others and connect with them by creating a profile that may include very personal informations such as home addresses or telephone numbers. Social sites became one of the most popular Internet activities among teenagers. The most common age is between 14 and 23. While they think it's fun Facebook has some dangerous sides. For example: maybe strangers are looking for your personal informations that can give them help to break one of the laws.</p>
</div>
<div id="pictures-right">
<img src="images/index1.jpg" alt="That's me">
<br />
<br />
<img src="images/index2.jpg" alt="Typing">
<br />
<br />
<img src="images/index3.jpg" alt="Social Network">
CSS:
html, body {
height: 100%;
}
body {
margin:0px;
padding:0px;
background-color: #4568b5;
}
#wrapper {
overflow: hidden;
width: 1100px;
margin:50px auto;
padding: 0px;
background-color: #ffffff;
}
#header {
overflow: hidden;
height: 150px;
background-color: #f05555;
}
#logo {
float: left;
padding: 45px 0px 0px 30px;
}
#logo h1 {
font-family: 'Bubblegum Sans', cursive;
font-size: 30pt;
font-weight: bold;
color: #e1e1e1;
}
#main-menu {
float:right;
width: 700px;
padding-top:60px;
padding-right: 40px;
}
#main-menu ul {
list-style: none;
}
#main-menu li {
float: right;
padding: 10px;
}
#main-menu a, #main-menu a:visited {
text-decoration: none;
color: #ffffff;
}
#main-menu a:hover {
text-decoration: underline;
}
#page {
overflow: hidden;
width: 1100px;
margin-left:30px;
}
#header-text {
padding-top: 10px;
font-family: "Comic Sans MS",Times,serif;
font-weight: 500;
font-size:22pt;
color:#0c3dd0;
text-align: left;
}
#header-pic {
margin-right: 350px;
padding-top: 10px;
padding-bottom: 25px;
}
#main-content {
float: left;
width: 750px;
padding-top: 1px;
text-align: justify;
font-family: 'Droid Serif', serif;
font-size: 15px;
color: #000000;
}
#pictures-right {
width: 300px;
margin-left: 800px;
}
válasza: válasza:Kicsit kellett rajta kalapálni, de most azthiszem olyan amilyet szeretnél. Arra figyelj oda, hogyha megnyitsz egy html tag-et, akkor azt le kell zárni. Erre mindig oda kell figyelni. A másik ami miatt nem úgy viselkedett ahogy szeretted volna: css-ben van egy olyan, hogy float:left; ha ennek utána nézel, akkor legközelebb magadtól is fog menni a dolog.
Üdv és szép napot !:)
válasza:Szia!
rosszat linkeltem be!:)
Azt linkeltem be amit te is küldtél
[link] remélhetőleg ez már jó lesz!:) Írd meg hogy jó e.
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!