Sponsored Links |
|
|||
ShenLung
Danke das du mir so aktiv Hilfst. Also ich habe das bis zu dem Punkt "content_container width: 960px; margin: auto" alles verstanden nur was danach kommt kann ich wenig mit Anfangen. Auch einen CSS-Code erstellen kann ich nicht. Den aktuellen hat ein Kumpel von mir zusammengewürfelt und ich habe nur die größen und die Links geändert. Hoffe das du mir noch ein bisschen mehr newb Hilfe geben kannst. Danke jetzt schon Greetz Dessauer |
Sponsored Links |
|
||||
Mal schauen
Also, die Seite die du planst ist vom Design/Aufbau her eigentlich nicht allzu kompliziert. Habe auch schon spaßeshalber ein wenig experimentiert. Meiner Meinung nach solltest du deinen CSS-Code in eine eigene Datei auslagern. Überhaupt solltest du dir Gedanken über den Aufbau deiner Seite machen. Du hast für dein Design zu viele divs (die in sich auch noch teilweise inkonsistent sind). Das geht schlanker. Du solltest dich wirklich mal zumindest mit den Grundlagen von CSS beschäftigen. So schwer ist das garnicht Du hast zwei 'content'-divs und der Äußere von beiden ist eigentlich überflüssig. Ich kann dir gerne mal morgen meine Version deiner index.html schicken. (Hatte heute leider meine Festplatte geschrottet und muss die erst wieder Rekonstruieren, sonst hätte ich es heute schon geschickt )
__________________
Gruß aus dem Westerwald Ingo |
|
|||
Hey ShenLung
Danke wirklich für deine große Hilfe! Also ich habe eigentlich den CSS Code extra, also nicht direkt mit beim HTML-Code. Beim HPBK kann ich den CSS Code einmal reinsetzen in ein Feld und dieser Gilt dann für jede Seite also schon weniger Aufwand Würde mir gerne deine Version anschauen wäre interessant wie du deiner Ansicht nach das machen würdest. Bin dir wirklich dankbar. Ja ich muss mich auch mal an CSS setzen und lernen neben schule und lehre =D Greetz Dessauer |
|
||||
Moin,
meine Daten sind weitgehend wieder da, also kann ich dir mal meine grobe Anpassung deiner Seite geben: Code:
* { margin: 0; padding: 0; } body { position: absolute; left: 20; top: 0px; background: #000000 url(http://img.webme.com/pic/d/der-dessauer/img24.jpg) no-repeat center top; font: normal 13px Georgia, "Times New Roman", Times, serif; color: #4E515B;width: 100%; } h1, h2, h3 { color: #CDCDE2; } h2 { } h3 { } p, blockquote, ul, ol { text-align: justify; } p { } blockquote { margin-left: 3em; } ul { margin-left: 3em; } ul li { } .list1 { margin: 0; padding: 0; list-style: none; } .list1 li { padding: 8px 0; background: url(http://img.webme.com/pic/d/der-dessauer/img5.gif) repeat-x center top; } .list1 .first li { background: none; } ol { margin-left: 3em; } ol li { } a { text-decoration: none; color: #CDCDE2; } a:hover { text-decoration: underline; color: none; } img { border: none; } img.left { float: left; margin: 5px 15px 0 0; } img.right { float: right; margin: 5px 0 0 15px; } /* Boxed Style */ .boxed { margin-bottom: 20px; } .boxed .title { padding: 5px 0; background: url(http://img.webme.com/pic/d/der-dessauer/img5.gif) repeat-x left bottom; } .boxed .title h2 { background: url(http://img.webme.com/pic/d/der-dessauer/img2.gif) no-repeat right center; text-transform: uppercase; font-size: 100%; } .boxed .content { padding: 20px 20px 40px 20px; } /* Post */ .post { } .post .title { padding: 5px 0; background: url(http://img.webme.com/pic/d/der-dessauer/img5.gif) repeat-x left bottom; } .post .title h2 { background: url(http://img.webme.com/pic/d/der-dessauer/img2.gif) no-repeat right center; text-transform: uppercase; font-size: 100%; } .post .date { float: left; width: 100px; height: 25px; padding-top: 15px; background: url(http://img.webme.com/pic/d/der-dessauer/img5.gif) repeat-y right top; text-align: center; font-size: 9px; } .post .date .month { } .post .date .day { } .post .date .year { } .post .meta { float: left; width: 300px; height: 32px; padding: 8px 0 0 20px; font-size: 9px; } .post .meta p { } .post .story { clear: both; padding: 20px; background: url(http://img.webme.com/pic/d/der-dessauer/img5.gif) repeat-x; } .post .story p, .post .story blockquote, .post .story ul, .post .story ol { margin-bottom: 1.5em; line-height: 180%; } /* Logo */ #logo { width: 700px; height: 220px; margin: 1 auto; } #logo h1 { margin: 0; padding: 59px 0 0 325px; text-transform: uppercase; letter-spacing: -5px; font-size: 72px; font-weight: normal; } #logo h2 { margin: -10px 0 0 0; padding: 0 0 0 325px; text-transform: uppercase; letter-spacing: 2px; font-size: 18px; font-weight: normal; } #logo a { text-decoration: none; color: #000000; } /* Page */ #container{ width: 100%; } #content_container{ width: 960px; margin: auto; } #page { width: 700px; margin: auto; } #extra { } /* Content */ #content{ float: right; width: 420px; padding: 20 0px; background: none; no-repeat; } /* Sidebar */ #sidebar { float: left; width: 200px; padding: 0 20px; background: url(http://img.webme.com/pic/d/der-dessauer/img3.gif) no-repeat right top; } /* Content > Sidebar > Login */ #login { } #login form { } #login fieldset { border: none; } #login legend { display: none; } #login label { font-size: x-small; font-weight: bold; } #login input { margin-bottom: 5px; padding: 2px 5px; border: none; font-family: Georgia, "Times New Roman", Times, serif; } #inputtext1, #inputtext2 { width: 150px; } #inputsubmit1 { width: 100px; background: transparent url(http://img.webme.com/pic/d/der-dessauer/img2.gif) no-repeat left top; color: #CDCDE2; text-transform: uppercase; letter-spacing: 2px; font-size: 10px; font-weight: bold; } /* Content > Sidebar > Menu */ #menu { width: 700px; height: 90px; margin: 0 auto; } #menu ul { margin: 0; padding-left: 20px; list-style: none; } #menu li { display: inline; } #menu a { display: block; float: left; height: 34px; padding: 12px 30px 0 40px; text-decoration: none; text-transform: uppercase; font-size: 16px; color: #4E515B; } #menu a:hover { background: url(http://img.webme.com/pic/d/der-dessauer/img2.gif) no-repeat 15px 50%; color: #CDCDE2; } #menu .first a { border: none; } #menu .active a { color: #FFFFFF; } /* Footer */ #footer { text-align: center; clear: both; width: 100%; margin: 0 auto; padding: 0 0 150px 0; background: url(http://img.webme.com/pic/d/der-dessauer/footer.jpg) no-repeat center; } #footer p { margin: 0; text-align: center; font-size: x-small; } /* Footer > Legal */ #legal { } /* Footer > Links */ #links { } HTML-Code:
<body id="hpb_cssonly"> <style type="text/css"> #ad-eccb br { display: none; } </style> <table height="102" id="ad-eccb"> <tr> <td height="102"> <iframe src="http://ads.webme.com/banner.php?pos=bw" frameborder="0" width="728" height="90" scrolling="no"></iframe></td> </tr> </table> <body bgcolor="#000000" text="#ffffff" link="#000000" vlink="#000000" alink="#000000"> <div id="container"> <div id="header_container"> <div id="pre_header"></div> <div class="header"><h1 id="header"><span>dessauer</span></h1></div> <div id="post_header"></div> </div> <div id="nav_container"> <h2 id="nav_heading"><span></span></h2> <ul id="nav"> <li class="nav_element checked_menu" id="nav_Home"> <a href="/Home.htm" class="menu"><span><font color=#202020>Home</font></span></a></li> <li class="nav_element subpage" id="nav_Gallerie"> <a href="/Gallerie.htm" class="menu"><span>Gallerie</span></a></li> <li class="nav_element subpage" id="nav_About"> <a href="/About.htm" class="menu"><span>About</span></a></li> <li class="nav_element subpage" id="nav_Gstebuch"> <a href="/G.ae.stebuch.htm" class="menu"><span>G�stebuch</span></a></li> <li class="nav_element subpage" id="nav_Kontakt"> <a href="/Kontakt.htm" class="menu"><span>Kontakt</span></a></li> <li class="nav_element subpage" id="nav_Gal"> <a href="/Gal.htm" class="menu"><span>Gal</span></a></li> <li class="nav_element subpage" id="nav_Artist"> <a href="/Artist.htm" class="menu"><span>Artist</span></a></li> <li class="nav_element subpage" id="nav_Videos"> <a href="/Videos.htm" class="menu"><span>Videos</span></a></li> <li class="nav_element subpage" id="nav_Impressum"> <a href="/Impressum.htm" class="menu"><span>Impressum</span></a></li> <li class="nav_element" id="nav_Galerie"> <a href="/Galerie.htm" class="menu"><span>Galerie</span></a></li> <li class="nav_element" id="nav_bermich"> <a href="/-Ue-ber-mich.htm" class="menu"><span>�ber mich</span></a></li> <li class="nav_element" id="nav_Impressum1"> <a href="/Impressum1.htm" class="menu"><span>Impressum1</span></a></li> <li class="nav_element" id="nav_HtmlHilfen"> <a href="/Html-Hilfen.htm" class="menu"><span>Html Hilfen</span></a></li> <li class="nav_element" id="nav_Kontakt1"> <a href="/Kontakt1.htm" class="menu"><span>Kontakt1</span></a></li> <li class="nav_element" id="nav_homme"> <a href="/homme.htm" class="menu"><span>homme</span></a></li> <li class="nav_element" id="nav_test"> <a href="/test.htm" class="menu"><span>test</span></a></li> </ul> </div> <div id="content_container"> <div id="pre_content"></div> <div> <h2 id="title"><span>Home</span></h2> <p> </p> <div id="logo"> <h1><span style="color: rgb(255, 0, 0);"><span style="text-decoration: underline;"><br /> </span></span></h1> <h2> </h2> </div> <br /> <div id="menu"> <ul> <li><a href="http://www.der-dessauer.de.tl/home.htm"><strong><span style="color: rgb(255, 0, 0);">H</span>ome</strong></a></li> <li><a href="http://www.der-dessauer.de.tl/about.htm"><strong><span style="color: rgb(255, 0, 0);">Ü</span>ber <span style="color: rgb(255, 0, 0);">U</span>ns<br /> </strong></a></li> <li><a href="http://www.der-dessauer.de.tl/gallerie.htm"><strong><span style="color: rgb(255, 0, 0);">G</span>alerie</strong></a></li> <li><a href="http://www.der-dessauer.de.tl/g.ae.stebuch.htm"><strong><span style="color: rgb(255, 0, 0);">G</span>b</strong></a></li> <li><a href="http://www.der-dessauer.de.tl/kontakt.htm"><strong><span style="color: rgb(255, 0, 0);">K</span>ontakt</strong></a></li> </ul> </div> <!-- end #menu --> <div id="page"> <div id="content"> <div class="post" id="welcome"> <div class="title"> <h2 style="text-align: center;"><span style="color: rgb(255, 0, 0);">W</span>illkommen <span style="color: rgb(255, 0, 0);">i</span>m <span style="color: rgb(255, 0, 0);">S</span>tudio</h2> <h3 class="date"><span class="month">17.April 2010</span></h3> <div class="meta"> <p><span style="text-decoration: underline;">Written by Michael Hofmeister</span></p> </div> <div class="story"><img height="112" width="112" class="left" alt="" src="http://dkpresents.files.wordpress.com/2009/02/neu75_albumcover1.jpg" /> <p><strong><span style="font-style: italic;">Wie Ihr sehen könnt, arbeiten wir an einem neuen Design um Eure Zufriedenheit zu garantieren. Ich hoffe das dieser neue Look für Euch genauso ein Augenschmaus ist wie für uns. Es wird nach und nach noch weitere Veränderungen geben.</span></strong></p> </div> <h1 style="text-align: center;"> </h1> </div> <div class="story"> <div class="title"> <h2 style="text-align: center;"><span style="color: rgb(255, 0, 0);">U</span>mbau</h2> </div> <h3 class="date"><span class="month">18.April 2010</span></h3> <p style="text-align: justify;"> </p> <p style="text-align: justify;"><strong>In den letzten Wochen wurde das Tattoostudio "Dragon Claw" umgebaut.<br /> Nun stehen mehr Platz und ein separater Eingang für Euch zu Verfügung.<br /> Dieser Eingang befindet sich nun auf der Hinterseite, so dass Ihr nicht mehr durch den Friseursalon "Lé Figaro" laufen müsst um in mein Studio zu kommen.<br /> <br /> Gruß Dominik</strong></p> </div> </div> <div class="post" id="example"> <div class="title"><center><br /> <p> </p> </center></div> </div> </div> <!-- end #content --> <div id="sidebar"> <div id="login" class="boxed"> <div class="title"> <h2><span style="color: rgb(255, 0, 0);">F</span>avoriten</h2> </div> <div class="content"> <div class="ad_125x125_box"><img height="100" width="75" src="http://img.webme.com/pic/t/tattoostudio-dragon-claw/dsc00203_300_400.jpg" alt="" /> <img height="100" width="75" src="http://img.webme.com/pic/t/tattoostudio-dragon-claw/dsc00217_300_400.jpg" alt="" /></div> <div class="ad_125x125_box"><br /> <img height="100" width="75" src="http://img.webme.com/pic/t/tattoostudio-dragon-claw/dsc00205_300_400.jpg" alt="" /> <img height="100" width="75" src="http://img.webme.com/pic/t/tattoostudio-dragon-claw/dsc00222_300_400.jpg" alt="" /></div> <br /> <div class="ad_125x125_box"><a href="http://tattoostudio-dcity.de/galerie.htm"> <br /> </a> <br /> <iframe scrolling="no" height="318" frameborder="0" align="aus" width="150" src="http://www.homepage-baukasten-dateien.de/success4you/fluegel.htm" style="border: 0px none rgb(0, 0, 0);" name="myiframe1" marginheight="0" marginwidth="0"></iframe> <p> </p> </div> <div class="ad_125x125_box"><a href="http://tattoostudio-dcity.de/galerie.htm"> <br /> </a></div> <div class="cleaner" style="text-align: left;"> </div> </left></div> </div> </div> <div style="clear: both;"> </div> </div> <div id="footer"> <div> Copyright © 2010. All Rights Reserved. Designed by Michael Hofmeister.</div> <div><a href="http://www.der-dessauer.de.tl/impressum.htm"><span style="font-size: small;"><span style="color: rgb(255, 255, 0);">Impressum</span></span></a></div> </div> <p><a href="http://www.der-dessauer.de.tl/Impressum"> </a></p> </div> <div id="counter"><span></span></div> <div id="post_content"></div> <div id="sidebar_container"> <h2 id="sidebar_heading"><span></span></h2> <div id="sidebar_content"></div> </div> </div> </div> <iframe src="http://www.homepage-baukasten.de/cookie.php?visit=der-dessauer&auth1=85ebe1a9b35878a7004862605ccc2d99&auth2=d774dd7188a5a6b691f443994aca96ad&auth3=ba110166e7bd8055a405db4a2acfb476&auth4=38746d7bd53fd7311e552a32a3322ed6&auth5=b88f319d05160bf120decc710cb4daf9&mode=track" style="display:none;width:1px;height:1px;"></iframe> <script src="http://www.google-analytics.com/urchin.js" type="text/javascript" ></script> <script type="text/javascript"> _uacct = "UA-2594508-8"; urchinTracker(); _uff = 0; _uacct = "UA-2594508-32"; urchinTracker(); </script> <script type="text/javascript" src="http://ads.webme.com/popunder.php"></script> </body>
__________________
Gruß aus dem Westerwald Ingo |
|
|||
Also dein Einsatz ist bemerkenswert ShenLung und deine Geduld auch.
Nur wenn ich nun dein CSS-Code und deinen HTML-Code nehme dies auf die Seite mache dann zeigt er mir die Seite auch verschoben an und genau das wollte ich ja nich =D Hoffe das ich bald das Problem los bin nervt ganz schön Danke dir dennoch für deine Hilfe |
|
||||
Also bei mir sieht es [gelöscht] aus. Das ist eigentlich nichts verschoben. Oder was genau meinst du?
Evtl. verwurstelt dir der HPBK das Design auch etwas.
__________________
Gruß aus dem Westerwald Ingo Geändert von ShenLung (03.05.2010 um 21:35 Uhr) |
|
||||
Wenn ich mir das bisherige Ergebnis so anschauen muss ich dir leider sagen: Das is nix
Dir fehlt es an Grundkenntnissen. Die solltest du dir erst mal aneignen. Mit Little Boxes z.B.. @ShenLung Watt soll datt denn: HTML-Code:
body { position: absolute; left: 20; top: 0px; font: normal 13px Georgia, "Times New Roman", Times, serif; } p, blockquote, ul, ol { text-align: justify; } Serifenschriften sind für Fließtext im Web nicht gut geeignet und Pixel als Schriftgröße schon gleich gar nicht. Was das normal da soll erschließt sich mir auch nicht. Blocksatz ist im Web aus guten Gründen ein Nogo. Browser können keine Silbentrennung.
__________________
Ein mehrfacher Gruß aus dem Südosten Klaus |
Sponsored Links |
|
||||
Hups, seh ich auch gerade. Da sollte eigentlich nur width: 100% hin. Dann hatte ich das wohl nur im Firebug geändert
Naja, wie ich schon schrieb, die Seite sollte von Grund auf konsistent neu gebaut werden. Da ist zu viel code der überflüssig oder falsch ist. Darin dann was zu ändern ist nicht wirklich eine Freude
__________________
Gruß aus dem Westerwald Ingo |
Sponsored Links |
Stichwörter |
css, design, hilfe, homepage, html, neu |
Themen-Optionen | |
Ansicht | |
|
|
Ähnliche Themen | ||||
Thema | Autor | Forum | Antworten | Letzter Beitrag |
design automatisch verlängern | elias1993 | CSS | 4 | 06.05.2011 19:47 |
Design Scrollbalken in IE FF und O (mit Bildern) | MarkusStar | CSS | 1 | 08.03.2009 14:27 |
Was haltet ihr von Design? | tobik999 | Offtopic | 10 | 28.11.2008 23:03 |
Sitecheck: Barrierearm - Design - Ajax | Schmidt | Site- und Layoutcheck | 16 | 21.08.2008 20:06 |
Design fertig aber welche Herangehensweise | JanW1989 | (X)HTML | 12 | 28.08.2006 18:06 |