Suche im Forum:
Suchen


Autor Nachricht
Beitrag29.06.2012 um 12:47 (UTC)    
Titel: #content hilfe?

Hat wer eine Seite, ein Tutorial so das ich das content richtig einstellen kann oder kann einer von euch mir helfen`?

Text über dem Design.

Zitat:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">
<head>
<title>Web site</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta name="title" content="Web site" />
<meta name="description" content="Site description here" />
<meta name="keywords" content="keywords here" />
<meta name="language" content="en" />
<meta name="subject" content="Site subject here" />
<meta name="robots" content="All" />
<meta name="copyright" content="Your company" />
<meta name="abstract" content="Site description here" />
<meta name="MSSmartTagsPreventParsing" content="true" />
<link id="theme" rel="stylesheet" type="text/css" href="style.css" title="theme" />
<script type="text/javascript" language="javascript" src="js/jquery.js"></script>
<script type="text/javascript" language="javascript" src="js/custom.js"></script>
<script type="text/javascript" language="javascript" src="js/addon.js"></script>
</head>
<body>
<div id="top">
<div class="overlay">
</div>
</div>
<div id="wrapper">
<div class="overlay"></div>
<div class="border-top"></div>

<div id="container">
<div class="hd">
<div id="container-top"></div>
<div id="banner"></div>
<div id="hmenu-wpr">
<ul id="hmenu" class="sf-menu sf-js-enabled sf-shadow">
<li class="current" style="border:none">
<a class="toplvl sf-with-ul" href="http://cwl-soccer.de.tl/Home.htm">Home</a>
</li>
<li>
<a href="#" class="toplvl">Products</a>
<ul>
<li>
<a href="#">menu item</a>
</li>
<li class="current">
<a href="#">menu item</a>
<ul>
<li class="current">
<a href="#">menu item</a>
</li>
<li>
<a href="#">menu item</a>
</li>
<li>
<a href="#">menu item</a>
</li>
<li>
<a href="#">menu item</a>
</li>
<li>
<a href="#">menu item</a>
</li>
</ul>
</li>
<li>
<a href="#">menu item</a>
<ul>
<li>
<a href="#">menu item</a>
</li>
<li>
<a href="#">menu item</a>
</li>
<li>
<a href="#">menu item</a>
</li>
<li>
<a href="#">menu item</a>
</li>
<li>
<a href="#">menu item</a>
</li>
</ul>
</li>
<li>
<a href="#">menu item</a>
<ul>
<li>
<a href="#">menu item</a>
</li>
<li>
<a href="#">menu item</a>
</li>
<li>
<a href="#">menu item</a>
</li>
<li>
<a href="#">menu item</a>
</li>
<li>
<a href="#">menu item</a>
</li>
</ul>
</li>
</ul>
</li>
<li>
<a class="toplvl" href="#">Services</a>
<ul>
<li>
<a href="#">menu item</a>
</li>
<li class="current">
<a href="#">menu item</a>
<ul>
<li class="current">
<a href="#">menu item</a>
</li>
<li>
<a href="#">menu item</a>
</li>
<li>
<a href="#">menu item</a>
</li>
<li>
<a href="#">menu item</a>
</li>
<li>
<a href="#">menu item</a>
</li>
</ul>
</li>
<li>
<a href="#">menu item</a>
<ul>
<li>
<a href="#">menu item</a>
</li>
<li>
<a href="#">menu item</a>
</li>
<li>
<a href="#">menu item</a>
</li>
<li>
<a href="#">menu item</a>
</li>
<li>
<a href="#">menu item</a>
</li>
</ul>
</li>
<li>
<a href="#">menu item</a>
<ul>
<li>
<a href="#">menu item</a>
</li>
<li>
<a href="#">menu item</a>
</li>
<li>
<a href="#">menu item</a>
</li>
<li>
<a href="#">menu item</a>
</li>
<li>
<a href="#">menu item</a>
</li>
</ul>
</li>
</ul>
</li>
<li>
<a class="toplvl" href="#">About Us</a>
</li>
</ul>
</div>
</div>
<div class="bd">
<div id="page">
<!-- SIDEBAR -->
<div id="sidebar">
<div class="content">
<div class="sidebox1">
<h2>Links</h2>
<div class="vmenu">
<ul>
<li>
<a href="http://cwl-soccer.de.tl/#">Home</a>
</li>
<li>
<a href="http://cwl-soccer.de.tl/Ligaregeln.htm">Regelwerk</a>
</li>
<li>
<a href="http://cwl-soccer.de.tl/Das-Forum-/index.htm">Forum</a>
</li>
<li>
</ul>
</div>
</div>
<div>

</div>
<div class="sidebox1">
<h2>CWL Admins</h2>
<p>

<a href="http://live.xbox.com/de-DE/Profile?gamertag=FE%20Gaucho%20I%207%20I" target="_blank">FE Gaucho I 7 I</a>
<br />
<a href="http://live.xbox.com/de-DE/Profile?gamertag=xxthexdomixx" target="_blank">xXThexDomiXx</a>
<br />
<a href="http://live.xbox.com/de-DE/Profile?gamertag=ISL%20Obinna" target="_blank">ISL Obinna</a>
<br />
<a href="http://live.xbox.com/de-DE/Profile?gamertag=FE%20Cech%20I%201%20I" target="_blank">FE Cech I 1 I</a>
</p>
</div>
</div>
</div>
<!-- END SIDEBAR -->
<!-- MAIN COLUMN -->
<div id="main">
<div class="content">



<h3></h3>
<p>

</p>
<h2 style="margin-top:35px;"></h2>
<p>
</p>
<p>
.</p>
<div style="margin-top:25px;">
<!-- TO REMOVE -->
<h3></h3>
<p>
</p>
</div>
</div>
</div>






<!-- END MAIN -->
<!-- SIDEBAR 2 -->
<div id="sidebar2">
<div class="content">
<div class="sidebox2">
<h2>Kontakt</h2>
<div class="vmenu">
<ul>
<li>
<a href="http://www.facebook.com/groups/210100505675004/"><img src="http://www.digitalscrapper.com/images/facebook-icon.png" /></a>
</li>
</ul>
</div>
</div>
<div class="sidebox2">
<h2>Ende der Hinrunde</h2>
<p>





<div style="text-align: center;">
<span id="c1" style="font: bold 30px arial; color: #000000
;"></span><br>
<span id="c2" style="font: bold 25px arial; color: #DDDDDD
;">;</span><br>
<small>...bis zum 01 Januar 2013 / 20:00 Uhr</small>
</div>

<script type='text/javascript'>
// Erstellt mit dem Countdown-Generator - Homepage-Total.de
// Die Monatsnamen bitte in englisch eintragen (Monatsname, Tag, Jahr, Uhrzeit)
var end = new Date('January 01, 2013 20:00:00');

function toSt2(n) {
var s = '';
if (n < 10) {
s += '0';
}
return (s + n).toString();
}

function toSt3(n) {
var s = '';
if (n < 10) {
s += '00';
}
else if (n < 100) {
s += '0';
}
return (s + n).toString();
}

function countdown() {
var d = new Date();
var count = Math.floor(end.getTime() - d.getTime());
if (count > 0) {
var miliseconds = toSt3(count%1000); count = Math.floor(count/1000);
var seconds = toSt2(count%60); count = Math.floor(count/60);
var minutes = toSt2(count%60); count = Math.floor(count/60);
var hours = toSt2(count%24); count = Math.floor(count/24);
var days = count;
document.getElementById('c1').innerHTML = days + ' TAGE';
document.getElementById('c2').innerHTML = hours + ':' + minutes
setTimeout('countdown()', 100);
}
}
countdown();
</script>








</p>
</div>
</div>
</div>
<!-- END SIDEBAR 2 -->
<div class="clear" style="height:60px"></div>
</div>
</div>
<div class="ft">
<div id="footer">
<div class="content">
<!--
Keep this footer link UNCHANGED AND VISIBLE or make a 10 dollars donation at www.dotemplate.com/#donate to remove it.
-->
<p>
<a href="http://www.dotemplate.com">Free templates</a>
</p>
</div>
</div>
<div id="container-bottom"></div>
</div>
</div>
</div>
</div>
<div class="clear"></div>
</body>
</html>





CCS-Code ohne Style-Tags:

Zitat:
/* CSS reset 3.2.0 Copyright (c) Yahoo. */
body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,code,form,fieldset,legend,input,textarea,p,blockquote,th,td{
margin:0;
padding:0;
}

table[height="102"] { margin: auto; }
}

fieldset,img{
border:0;
}

address,caption,cite,code,dfn,em,strong,th,var{
font-style:normal;
font-weight:normal;
}

li{
list-style:none;
}

caption,th{
text-align:left;
}

h1,h2,h3,h4,h5,h6{
font-size:100%;
font-weight:normal;
}

q:before,q:after{
content:'';
}

abbr,acronym{
font-variant:normal;
border:0;
}

sup{
vertical-align:text-top;
}

sub{
vertical-align:text-bottom;
}

input,textarea,select{
font-size:inherit;
font-family:inherit;
font-weight:inherit;
}

legend{
color:#000;
}

a img{
border:none;
}

.clear{
clear:both;
height:0;
visibility:hidden;
width:0;
overflow:hidden;
display:block;
}

html{
overflow-Y:scroll;
margin:0 0 0 -1px;
}

body{
width:100%;
display:table;
}

#top{
position:relative;
height:50px;
width:100%;
background-color:transparent;
background-position:center top;
background-repeat:repeat;
background-image:url('http://img5.fotos-hochladen.net/uploads/topbgz3wa4l1nem.png');
}

#top .overlay{
position:absolute;
height:500px;
width:1400px;
background-color:transparent;
margin-left:-700.0px;
left:50%;
background-repeat:no-repeat;
background-image:url('http://img5.fotos-hochladen.net/uploads/topimg0m5dhqjrbt.png');
background-position:center top;
}

#wrapper{
width:100%;
background-color:transparent;
background-position:center top;
background-repeat:repeat;
background-image:url('http://img5.fotos-hochladen.net/uploads/texturecm2vjk734t.png');
}

#wrapper .overlay{
position:absolute;
height:500px;
width:1400px;
background-color:transparent;
margin-left:-700.0px;
left:50%;
background-repeat:no-repeat;
background-image:url('http://img5.fotos-hochladen.net/uploads/wrapperbg8qlb1furax.png');
background-position:center top;
}

#wrapper .border-top{
position:absolute;
height:25px;
width:100%;
background-color:transparent;
background-repeat:repeat-x;
background-image:url('http://img5.fotos-hochladen.net/uploads/wrapperbordert5go49ufqec.png');
background-position:center top;
}

#container{
position:relative;
width:1150px;
margin:0 auto;
}

#container .hd{
height:420px;
width:100%;
background-color:transparent;
margin:0 auto;
background-image:url('http://img5.fotos-hochladen.net/uploads/containerhd4j7eu0tdxq.png');
background-position:center top;
}

#container-top{
position:relative;
height:50px;
width:1050px;
}

#banner{
position:relative;
height:300px;
width:1050px;
background-color:transparent;
margin:0 auto;
background-position:center top;
background-image:url('----------------------');
}

#hmenu-wpr{
height:70px;
width:1050px;
margin:0 auto;
}

ul#hmenu{
list-style-type:none;
height:70px;
font:11px Helvetica,sans-serif;
text-transform:uppercase;
width:1050px;
margin:0 auto;
padding:0;
}

ul#hmenu li a, ul#hmenu li a:visited{
line-height:24px;
color:#ffffff;
}

ul#hmenu li a.toplvl, ul#hmenu li a.toplvl:visited{
line-height:70px;
color:#EEEEEE;
font-weight:bold;
padding:0 70px;
}

ul#hmenu li a.toplvl:hover, ul#hmenu li.current a.toplvl{
color:#ffffff;
background-color:transparent;
background-image:url('http://img5.fotos-hochladen.net/uploads/hmenuseltaj98i0fdr.png');
background-position:left top;
background-repeat:repeat-x;
}

.sf-menu,.sf-menu *{
list-style:none;
}

.sf-menu{
line-height:1.0;
margin-bottom:1em;
float:left;
}

.sf-menu ul{
position:absolute;
width:150px;
top:-999em;
}

#hmenu .sf-menu ul{
height:70px;
}

.sf-menu ul li{
width:100%;
}

.sf-menu li:hover{
visibility:inherit;
}

.sf-menu li{
position:relative;
background-color:transparent;
float:left;
}

.sf-menu a{
position:relative;
text-decoration:none;
display:block;
}

.sf-menu li:hover ul,.sf-menu li.sfHover ul{
left:0;
z-index:99;
top:70px;
}

#hmenu .sf-menu li:hover ul,#hmenu .sf-menu li.sfHover ul{
top:70px;
}

ul.sf-menu li:hover li ul,ul.sf-menu li.sfHover li ul{
top:-999em;
}

ul.sf-menu li li:hover ul,ul.sf-menu li li.sfHover ul{
/* match ul width */top:0;
left:150px;
}

ul.sf-menu li li:hover li ul,ul.sf-menu li li.sfHover li ul{
top:-999em;
}

ul.sf-menu li li li:hover ul,ul.sf-menu li li li.sfHover ul{
/* match ul width */top:0;
left:150px;
}

.sf-menu ul li a{
padding:.75em 1em;
}

.sf-menu li li{
background:#404040;
}

.sf-menu li li li{
background:#404040;
}

.sf-menu li:hover, .sf-menu li.sfHover,.sf-menu a:focus, .sf-menu a:hover, .sf-menu a:active{
background:#363636;
outline:0;
}

.sf-menu a.sf-with-ul{
padding-right:2.25em;
min-width:1px;
}

.sf-sub-indicator{
position:absolute;
text-indent:-999em;
height:10px;
/* IE6 only */width:10px;
background:url('http://img5.fotos-hochladen.net/uploads/hmenuarrowsza4f1w5mpc.png') no-repeat 0px 0px;
overflow:hidden;
display:block;
right:.75em;
top:1.05em;
}

a > .sf-sub-indicator{
top:12px;
}

a.toplvl > .sf-sub-indicator{
/* give all except IE6 the correct values */top:32.0px;
background-position:0 -10px;
}

a:focus > .sf-sub-indicator,a:hover > .sf-sub-indicator,a:active > .sf-sub-indicator,li:hover > a > .sf-sub-indicator,li.sfHover > a > .sf-sub-indicator{
background-position:0px -100px;
}

.sf-menu ul .sf-sub-indicator{
background-position:-10px 0;
}

.sf-menu ul a > .sf-sub-indicator{
background-position:0 0;
}

.sf-menu ul a:focus > .sf-sub-indicator,.sf-menu ul a:hover > .sf-sub-indicator,.sf-menu ul a:active > .sf-sub-indicator,.sf-menu ul li:hover > a > .sf-sub-indicator,.sf-menu ul li.sfHover > a > .sf-sub-indicator{
background-position:-10px 0;
}

.sf-shadow ul{
-wwebkit-border-top-right-radius:17px;
box-shadow:5px 5px 5px #CCC;
-wwebkit-border-bottom-left-radius:17px;
-mmoz-border-radius-topright:17px;
-webkit-box-shadow:5px 5px 5px #CCC;
background:url('../images/shadow.png') no-repeat bottom right;
border:1px solid #AAA;
ppadding:0 8px 9px 0;
-mmoz-border-radius-bottomleft:17px;
-moz-box-shadow:5px 5px 10px #AAA;
}

.sf-shadow ul.sf-shadow-off{
background:transparent;
}

#container .bd{
position:relative;
width:100%;
background-color:transparent;
margin:0 auto;
background-position:center top;
background-repeat:repeat-y;
background-image:url('http://www.fotos-hochladen.net/uploads/containerbds7h40cgd5z.png');
}

#page{
position:relative;
width:1050px;
margin:0 auto;
}

#main{
position:relative;
line-height:20px;
letter-spacing:normal;
color:#000000;
text-transform:normal;
font-size:13px;
font-style:normal;
width:610px;
margin-left:0px;
font-family:Helvetica, Arial, sans-serif;
font-weight:normal;
float:left;
}

#main .content{
position:relative;
margin:20px 15px;
}

#main p a:link, #main p a:visited{
color:#1597A4;
text-decoration:none;
}

#main p a:hover{
color:#ffa500;
}

#main h1{
letter-spacing:-1px;
font-style:normal;
background-color:transparent;
font-weight:normal;
padding:0px;
color:#000000;
text-transform:none;
font-size:30px;
margin:15px 0 15px 0;
font-family:Helvetica, Arial, sans-serif;
border:0;
text-shadow:none;
background-image:none;
background-repeat:no-repeat;
}

#main h2{
letter-spacing:-1px;
font-style:normal;
background-color:transparent;
font-weight:normal;
padding:0px;
color:#000000;
text-transform:none;
font-size:18px;
margin:10px 0 10px 0;
font-family:Helvetica, Arial, sans-serif;
border:0;
text-shadow:none;
background-image:none;
background-repeat:no-repeat;
}

#main h3{
letter-spacing:1px;
font-style:normal;
background-color:transparent;
font-weight:bold;
padding:0px;
color:#000000;
text-transform:none;
font-size:14px;
margin:5px 0;
font-family:'Trebuchet MS', sans-serif;
border:0;
text-shadow:none;
background-image:none;
background-repeat:no-repeat;
}

#main .content p{
text-align:justify;
}

#main h1:first-child{
margin:0px 0 15px 0;
}

#sidebar{
position:relative;
width:220px;
float:left;
}

#sidebar .content{
position:relative;
margin:0 10px;
}

#sidebar2{
position:relative;
width:220px;
margin-left:0px;
float:left;
}

#sidebar2 .content{
position:relative;
margin:0 10px;
}

#page a:link, #page a:visited{
text-decoration:none;
}

#page a:hover{
text-decoration:underline;
}

#container .ft{
position:relative;
height:130px;
width:100%;
background-color:transparent;
margin:0 auto;
background-position:center top;
background-repeat:repeat-y;
background-image:url('http://img5.fotos-hochladen.net/uploads/containerft7h5rvy21aq.png');
}

#footer{
position:relative;
letter-spacing:normal;
width:1050px;
font-style:normal;
background-color:transparent;
font-weight:normal;
line-height:20px;
height:50px;
color:#404040;
text-transform:normal;
font-size:12px;
font-family:Helvetica, Arial, sans-serif;
margin:0 auto;
background-image:none;
}

#footer .content{
position:relative;
text-align:center;
width:100%;
margin-top:20px;
float:left;
}

#footer p a:link, #footer p a:visited{
color:#ffffff;
text-decoration:none;
}

#footer p a:hover{
color:#ffffff;
}

#container-bottom{
position:relative;
height:80px;
width:1050px;
margin:0 auto;
}

.sidebox1{
letter-spacing:normal;
font-style:normal;
background-color:transparent;
font-weight:normal;
padding:0px;
line-height:20px;
color:#000000;
text-transform:normal;
font-size:14px;
font-family:Helvetica, Arial, sans-serif;
margin:20px 0px 20px 0px;
border:0;
background-position:center top;
background-repeat:no-repeat;
background-image:none;
}

.sidebox1 p a:link, .sidebox1 p a:visited{
color:#000000;
text-decoration:none;
}

.sidebox1 p a:hover{
color:#00EE00;
}

.sidebox1 h2{
letter-spacing:1px;
font-style:normal;
background-color:transparent;
margin-bottom:15px;
font-weight:bold;
padding:5px;
line-height:18px;
color:#FFFFFF;
text-transform:none;
font-size:14px;
font-family:Arial, sans-serif;
border:1px solid #1e1e1e;
text-shadow:0 -1px #000000;
background-image:url('http://img5.fotos-hochladen.net/uploads/sidebox1h2bgwlu7dp6rhx.png');
background-repeat:repeat-x;
background-position:center top;
}

.sidebox1 .vmenu ul{
text-align:left;
text-decoration:none;
margin:7px 0px 8px 0px;
list-style:none;
border-top:1px solid #eeeeee;
padding:0;
}

.sidebox1 .vmenu ul li{
border-bottom:1px solid #eeeeee;
margin:0;
list-style:none;
padding:6px 0 6px 5px;
}

.sidebox1 .vmenu ul li a:link, .sidebox1 .vmenu ul li a:visited{
letter-spacing:normal;
color:#000000;
text-transform:normal;
font-style:normal;
font-size:12px;
font-family:Helvetica, Arial, sans-serif;
text-decoration:none;
font-weight:normal;
}

.sidebox1 .vmenu ul li a:hover{
}

.sidebox1 p{
text-align:justify;
}

.sidebox2{
letter-spacing:normal;
font-style:normal;
background-color:transparent;
font-weight:normal;
padding:0px;
line-height:20px;
color:#000000;
text-transform:normal;
font-size:12px;
font-family:Helvetica, Arial, sans-serif;
margin:20px 0px 20px 0px;
border:0;
background-position:center top;
background-repeat:no-repeat;
background-image:none;
}

.sidebox2 p a:link, .sidebox2 p a:visited{
color:#0000EE;
text-decoration:none;
}

.sidebox2 p a:hover{
color:#00EE00;
}

.sidebox2 h2{
letter-spacing:1px;
font-style:normal;
background-color:transparent;
margin-bottom:15px;
font-weight:bold;
padding:5px;
line-height:18px;
color:#FFFFFF;
text-transform:none;
font-size:14px;
font-family:Arial, sans-serif;
border:1px solid #1e1e1e;
text-shadow:0 -1px #000000;
background-image:url('http://img5.fotos-hochladen.net/uploads/sidebox2h2bghrj1bqgn27.png');
background-repeat:repeat-x;
background-position:center top;
}

.sidebox2 .vmenu ul{
text-align:left;
text-decoration:none;
margin:7px 0px 8px 0px;
list-style:none;
border-top:1px solid #eeeeee;
padding:0;
}

.sidebox2 .vmenu ul li{
border-bottom:1px solid #eeeeee;
margin:0;
list-style:none;
padding:6px 0 6px 5px;
}

.sidebox2 .vmenu ul li a:link, .sidebox2 .vmenu ul li a:visited{
letter-spacing:normal;
color:#000000;
text-transform:normal;
font-style:normal;
font-size:12px;
font-family:Helvetica, Arial, sans-serif;
text-decoration:none;
font-weight:normal;
}

.sidebox2 .vmenu ul li a:hover{
}

.sidebox2 p{
text-align:justify;
}


#extraDiv1 {display: none;}
#extraDiv2 {display: none;}
#extraDiv3 {display: none;}
#extraDiv4 {display: none;}
#extraDiv5 {display: none;}
#extraDiv6 {display: none;}
#pre_header {display: none;}
#post_header {display: none;}
#pre_content {display: none;}
#nav_heading{display: none;}
#nav{display: none;}
div.header{display: none;}
h1#title{display: none;}
h2#title span {display: none;}

#content {
position: absolute;
left: 50%;
top: 328px;
margin-left:-599px;
width: 660px;
padding:10px;
color: #000000;
font-size:13px;
font-family: Arial;
background-color:#transparent;
background-image:url();
border: 1px solid #000000;
height : 350px;
overflow:auto; }








Wie sieht dann der #content aus ?? Ich möchte ihn gerne dort in die Mitte von den 2 Boxen, ich glaube man sieht sofort wohin.
Beitrag01.07.2012 um 11:07 (UTC)    
Titel:

Habs gelöst


*/Clode
Beiträge der letzten Zeit anzeigen:   


Powered by phpBB © 2001, 2005 phpBB Group
Deutsche Übersetzung von phpBB.de