Hej!
Jag håller på en hemsida som man kan ser på bilden. Jag skulle vilja de de här 2 rutorna där det står server 1 och server 2, ska stå bredvid varandra. Jag förstår inte vad jag gör för fel. Här e koden.
HTML Koden
Kod:
<div id="news-container-1">
<h1>Maintenance</h1>
<h2>We are opening this site very soon!</h2>
</div>
<div id="server-container">
<div id="server-box">
<h1>SERVER 1</h1>
<h2 style="color:#900">OFFLINE</h2>
</div>
<div id="server-box">
<h1>SERVER 2</h1>
<h2 style="color:#900">OFFLINE</h2>
</div>
</div>
CSS koden
Kod:
#server-box, #server-box-2 {
background-image: url(../img/backgr.jpg);
background-position: center 0;
background-repeat: no-repeat;
text-align: center;
height: auto;
width: 235px; /*260px*/
padding: 15pt;
margin: auto;
margin-top: 10pt;
box-shadow: 0pt 0pt 10px rgb(0, 0, 0);
}
#server-box-2 {
margin-left: 90pt;
}
#server-container {
}
#news-container-1, #news-container-2 {
background-image: url(../img/backgr.jpg);
background-position: center 0;
background-repeat: no-repeat;
height: auto;
width: 490px; /*260px*/
padding: 15pt;
margin: auto;
margin-top: 90pt;
box-shadow: 0pt 0pt 10px rgb(0, 0, 0);
}
#news-container-2 {
margin-top: 10pt;
}
#footer_2 {
position: static;
margin-top: 10pt;
text-align: center;
}
h1 {
font: bold 35px/36px 'purista-web',Arial,sans-serif;
color: rgb(248, 134, 19);
padding: 0pt;
text-transform: uppercase;
text-shadow: 0pt 0pt 10px rgb(0, 0, 0);
margin: 0px;
}
h2 {
font: bold 24px/26px 'purista-web',Arial,sans-serif;
color: rgb(255, 255, 255);
padding: 0pt;
text-transform: uppercase;
text-shadow: 0pt 0pt 10px rgb(0, 0, 0);
margin: 0px;
}
h3 {
font: bold 14px/16px 'purista-web',Arial,sans-serif;
color: rgb(255, 255, 255);
padding: 0pt;
text-transform: uppercase;
text-shadow: 0pt 0pt 10px rgb(0, 0, 0);
margin: 0px;
}
h4 {
font: bold 11px/12px 'purista-web',Arial,sans-serif;
color: rgb(255, 255, 255);
padding: 0pt;
text-transform: uppercase;
text-shadow: 0pt 0pt 10px rgb(0, 0, 0);
margin: 0px;
}