ilch Forum » Allgemein » Anfragen / Angebote » Anpassung von wa_portfolio1

Geschlossen
  1. Di. 14.12.2010 04:49 Uhr #1
    User Pic
    ILikeTurtels Mitglied
    Registriert seit
    11.12.2010
    Beiträge
    1
    Beitragswertungen
    0 Beitragspunkte
    Hallo, Ich hab eine Bitte an euch und zwar handelt es sich hierbei um
    wa_portfolio1 das Design ist im großen und ganzen gut aber mir fehlen halt die boxen ich bräuchte 1-2 deswegen würd ich mich freuen wen mir jemand das so wie in dem beispiel bild machen könnte

    H1 und m2 sollen eingefügt werden wichtig ist mir das H1 dabei auf der höhe von m1 endet so das boxen und content gleich beginnen so wie auf der grafik

    Es geht mir hierbei nur um den Code die Grafiken würde ich selbst beifügen und bearbeiten.

    Bsp:

    gesperrtes Bild


    Hier ist der Html Index code 
    <!-- Copyright des Designs, sowie der Anpassung an HTML als auch das ilch CMS bei Michel K&#65533;ser (web-area.ch) -->
<!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">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>{TITLE}</title>
<link href="include/designs/wa_portfolio1/_style/stylesheet.css" rel="stylesheet" type="text/css" />
<link href="include/designs/wa_portfolio1/favicon.ico" rel="shortcut icon" type="image/x-icon" />
<!-- PNG FIX for IE6 -->
<!-- http://24ways.org/2007/supersleight-transparent-png-in-ie6 -->
<!--[if lte IE 6]>
<script type="text/javascript" src="include/includes/js/pngfix/supersleight-min.js"></script>
<![endif]-->
<!-- jQuery - the core -->
<script src="include/includes/js/jquery-1.3.2.min.js" type="text/javascript"></script>
<!-- Sliding effect -->
<script src="include/includes/js/slide.js" type="text/javascript"></script>
</head>

<body>
<!-- Beginn Loginbox -->
<div id="">{_boxes_panel_login}</div>
<!-- Beginn Layout -->
<div id="layout">
  <!-- Beginn Header -->
  <div id="header">
    <!-- Beginn Logo -->
    <div id="logo"><a href="http://www.terrific-network.eu/" target="_blank"><img src="http://www.multicoretv.de/include/designs/wa_portfolio1/images/layout/logo.png" border="0" ></div>
  </div>
  <!-- Beginn Bluebar -->
  <div class="bluebar"></div>
  <!-- Beginn Navigation -->
  <div id="navigation">
    <!-- Beginn Menu -->
    <div id="menu">
      <!-- Beginn Links -->
      <ul>
        <li>{_list_menunr2@ %2 }</li>
      </ul>
    </div>
  </div>
  <!-- Beginn Content -->
  <div id="content">
    <!-- Beginn Inhalt -->
     <div id="inhalt">
		{EXPLODE}
	 </div>
  </div>
  <!-- Beginn Bluebar -->
  <div class="bluebar"></div>
  <!-- Beginn Footer -->
  <div id="footer">
    <!-- Beginn Copyright -->
     <div id="copyright">Copyright 2009 {SITENAME} - Design <a href="http://web-area.ch/" target="_blank">web-area.ch</a></div>
  </div>
      <!-- Beginn Impressum -->
    <div id="impressum"><a href="http://www.multicoretv.de/?impressum">Impressum</a><a href="http://www.multicoretv.de/?contact">Kontakt</a></div>
  </div>
</div>
</body>
</html>
{_list_vmenupoint@<a target="%1" href="%2">%3</a> }
{_list_vmenubegi@}
{_list_vmenuende@}


    und hier der dazugehörige stylesheet.css 
    @charset "utf-8";
/* CSS Document */

@import url('content.css');
@import url('slide.css');

body {
background-position:top center;
background-image: url(../images/layout/bg.jpg);
background-color: #262626;
background-repeat: non-repeat;
margin-top: 0-auto;
font-family: Arial;
font-size: 12px;
color: #787878;
background-attachment:fixed
}

/* Beginn Layout */
#layout {
width: 762px;
height: auto;
margin: auto;
border: 1px solid #454545;
}

/* Beginn Header */
#header {
background-image: url(../images/layout/header.png);
height: 132px;
}

/* Beginn Logo */
#logo {
background-image: ;
height: 84px;
width: 100px;
position: relative;
left: 542px;
top: 33px;
}

/* Beginn Bluebar */
.bluebar {
background-image: url(../images/layout/bluebar.png);
width: 762px;
height: 4px;
}

/* Beginn Navigation */
#navigation {
background-image: url(../images/layout/navigation.png);
width: 762px;
height: 29px;
}

/* Beginn Menu */
#menu {
width: 728px;
height: 24px;
position: relative;
top: 5px;
left: 18px;
}

/* Beginn Links */
#menu ul {
position: relative;
padding: 0 0 0 0;
margin: 0 0 0 0;
height: 24px;
list-style: none;
}

#menu ul li {
float: left;
}

#menu ul li a {
float: left;
display: block;
color: #ffffff;
text-decoration: none;
font-family: Arial;
font-size: 12px;
padding: 0 12px 0 12px;
height: 20px;
line-height: 21px;
}

#menu ul li a:hover {
color: #ffffff;
background-color: #333333;
}

/* Beginn Content */
#content {
background-color: #ffffff;
width: 760px;
height: auto;
border: 1px solid #f5f5f5;
}

#inhalt {
width: 734px;
height: auto;
margin-top: 14px;
margin-right: 14px;
margin-left: 14px;
margin-bottom: 14px;
text-align: justify;
}

/* Beginn Footer */
#footer {
background-image: url(../images/layout/schatten.png);
width: 762px;
height: 22px;
}

/* Beginn Copyright */
#copyright {
width: 340px;
font-family: Arial;
font-size: 10px;
color: #bebebe;
position: relative;
top: 5px;
left: 410px;
text-align: right;
}
/* Beginn Impressum */
#impressum {
width: 340px;
font-family: Arial;
font-size: 10px;
color: #bebebe;
position: relative;
top: 5px;
left: 410px;
text-align: right;
}


    Die slide.css 
    /*
Name: Sliding Login Panel with jQuery 1.3.2
Author: Jeremie Tisseau
Author URI: http://web-kreation.com/
Script URI: http://web-kreation.com/index.php/tutorials/nice-clean-sliding-login-panel-built-with-jquery/
Date: March 26, 2009
Version: 1.0

	The CSS, XHTML and design is released under Creative Common License 3.0:
	http://creativecommons.org/licenses/by-sa/3.0/

*/ 

/***** clearfix *****/
.clear {clear: both;height: 0;line-height: 0;}
.clearfix:after {content: ".";display: block;height: 0;clear: both;visibility: hidden;}
.clearfix {display: inline-block;}
/* Hides from IE-mac \*/
* html .clearfix {height: 1%;}
.clearfix {display: block;}
/* End hide from IE-mac */
.clearfix {height: 1%;}
.clearfix {display: block;}

/* Panel Tab/button */
.tab {
  	background: url(../images/slider/tab_b.png) repeat-x 0 0;
	height: 42px;
	position: relative;
    top: 0;
    z-index: 999;
}

.tab ul.login {
	display: block;
	position: relative;
  	float: right;
  	clear: right;
  	height: 42px;
	width: auto;
  	font-weight: bold;
	line-height: 42px;
	margin: 0;
	right: 150px;
  	color: white;
  	font-size: 80%;
	text-align: center;
}

.tab ul.login li.left {
  	background: url(../images/slider/tab_l.png) no-repeat left 0;
  	height: 42px;
	width: 30px;
	padding: 0;
	margin: 0;
  	display: block;
	float: left;
}

.tab ul.login li.right {
  	background: url(../images/slider/tab_r.png) no-repeat left 0;
  	height: 42px;
	width: 30px;
	padding: 0;
	margin: 0;
  	display: block;
	float: left;
}

.tab ul.login li {
 	text-align: left;
  	padding: 0 6px;
	display: block;
	float: left;
	height: 42px;
  	background: url(../images/slider/tab_m.png) repeat-x 0 0;
}

.tab ul.login li a {
	color: #15ff20;
}

.tab ul.login li a:hover {
	color: white;
}

.tab .sep {color:#414141}

.tab a.open, .tab a.close {
	height: 20px;
	line-height: 20px !important;
	padding-left: 30px !important;
	cursor: pointer;
	display: block;
	width: 100px;
	position: relative;
	top: 11px;
}

.tab a.open {background: url(../images/slider/bt_open.png) no-repeat left 0;}
.tab a.close {background: url(../images/slider/bt_close.png) no-repeat left 0;}
.tab a:hover.open {background: url(../images/slider/bt_open.png) no-repeat left -19px;}
.tab a:hover.close {background: url(../images/slider/bt_close.png) no-repeat left -19px;}

/* sliding panel */
#toppanel {
    position: absolute;   /*Panel will overlap  content */
    /*position: relative;*/   /*Panel will "push" the content down */
    top: 0;
	left: 0;
    width: 100%;
    z-index: 999;
    text-align: center;
    margin-left: auto;
    margin-right: auto;
}

#panel {
	width: 100%;
	height: 175px;
	color: #999999;
	background: #272727;
	overflow: hidden;
	position: relative;
	z-index: 3;
	display: none;
}

#panel h1 {
	font-size: 1.6em;
	padding: 5px 0 10px;
	margin: 0;
	color: white;
}

#panel h2{
	font-size: 1.2em;
	padding: 10px 0 5px;
	margin: 0;
	color: white;
}

#panel p {
	margin: 5px 0;
	padding: 0;
}

#panel a {
	text-decoration: none;
	color: #15ff20;
}

#panel a:hover {
	color: white;
}

#panel a-lost-pwd {
	display: block;
	float: left;
}

#panel .content {
	width: 960px;
	margin: 0 auto;
	padding-top: 15px;
	text-align: left;
	font-size: 0.85em;
}

#panel .content .left {
	width: 280px;
	float: left;
	padding: 0 15px;
	border-left: 1px solid #333;
}

#panel .content .right {
	border-right: 1px solid #333;
}

#panel .content form {
	margin: 0 0 10px 0;
}

#panel .content label {
	float: left;
	padding-top: 8px;
	clear: both;
	width: 280px;
	display: block;
}

#panel .content input.field {
	border: 1px #1A1A1A solid;
	background: #414141;
	margin-right: 5px;
	margin-top: 4px;
	width: 200px;
	color: white;
	height: 16px;
}

#panel .content input:focus.field {
	background: #545454;
}

/* BUTTONS */
/* Login and Register buttons */
#panel .content input.bt_login,
#panel .content input.bt_register {
	display: block;
	float: left;
	clear: left;
	height: 24px;
	text-align: center;
	cursor: pointer;
	border: none;
	font-weight: bold;
	margin: 10px 0;
}

#panel .content input.bt_login {
	width: 74px;
	background: transparent url(../images/slider/bt_login.png) no-repeat 0 0;
}

#panel .content input.bt_register {
	width: 94px;
	color: white;
	background: transparent url(../images/slider/bt_register.png) no-repeat 0 0;
}

#panel .lost-pwd {
	display: block;
	float:left;
	clear: right;
	padding: 15px 5px 0;
	font-size: 0.95em;
	text-decoration: underline;
}


    und die content.css 
    @charset "utf-8";
/* CSS Document */

h1 {
font-size: 14px;
color: #222222;
background-image: url(../images/style/h1.png);
padding: 4px;
}

h2 {
font-size: 13px;
color: #444444;
background-image: url(../images/style/h2.png);
padding: 3px;
}

h3 {
font-size: 12px;
color: #666666;
background-image: url(../images/style/h3.png);
padding: 2px;
}

h4 {
font-size: 12px;
color: #888888;
background-image: url(../images/style/h4.png);
padding: 1px;
}

a {
color: #777777;
text-decoration: none;
}

a:hover {
color: #0088c9;
text-decoration: underline;
}

a:visited {
color: #777777;
}

textarea {
width: 452px;
height: auto;
background-color: #fdfdfd;
border: 1px solid #ebebeb;
padding: 4px;
font-family: Arial;
font-size: 12px;
color: #393f43;
}

.Chead, .Chead th, .Chead a {
background-color: #fafafa;
color: #2c3335;
font-size: 13px;
}

.Chead1 {
background-image: url(../images/layout/pbg.jpg);
background-color: #fafafa;
color: #2c3335;
font-size: 13px;
}

.Cdark, .Cdark td, .Cdark a {
background-color: #fdfdfd;
color: #343b3e;
}

.Cmite {
background-color: #ffffff;
}

.Cmite1 {
background-color: #4d4d4d;
}

.Cnorm {
background-color: #fbfbfb;
}

.border {
border: 1px #f3f3f3 solid;
}

.smalfont {
font: 10px Tahoma;
}

fieldset {
border: 1px #ebebeb solid;
}

legend {
font: 13px Arial;
color: #394043;
font-weight: bold;
}

input[type="text"], input[type="password"], input[type="submit"], select, input {
font-family: Tahoma;
font-size: 12px;
color: #393f43;
background: #fdfdfd;
border: 1px #ebebeb solid;
min-height: 17px;
width: 200px;
margin-bottom: 2px;
padding: 4px;
} 

input:focus, select:focus, textarea:focus {
border: 1px #c3c3c3 solid;
}

input[type="submit"], input[type="reset"] {
font-weight: bold;
height: 25px;
padding: 4px;
}

input[type="radio"], input[type="checkbox"] {
border: 0px;
min-height: 0px;
width: 0px;
margin-bottom: 0px;
}


    Würde mich freuen wen mir dies bezüglich jemand helfen könnte.

    MFG

    PS: Messenger geb ich auf anfrage gerne raus


    Zuletzt modifiziert von ILikeTurtels am 14.12.2010 - 09:52:08
    0 Mitglieder finden den Beitrag gut.
Geschlossen

Zurück zu Anfragen / Angebote

Optionen: Bei einer Antwort zu diesem Thema eine eMail erhalten