U-Labs Community - CSS https://u-labs.de/forum/ Fragen und Probleme zur Auszeichnungssprache Cascading Style Sheets de Fri, 01 May 2026 11:23:25 GMT vBulletin 1 https://u-labs.de/forum/images/ulabs/misc/rss.png U-Labs Community - CSS https://u-labs.de/forum/ CSS-Selektor für Elemente ohne Klasse css-100/css-selektor-fuer-elemente-ohne-klasse-39690?goto=newpost Sat, 04 Nov 2017 10:42:10 GMT Ich habe eine ungeordnete Liste (ul) mit vielen Elementen. Diese weisen eine Reihe von unterschiedlichen CSS-Klassen auf. Für Tests brauche ich einen... Ich habe eine ungeordnete Liste (ul) mit vielen Elementen. Diese weisen eine Reihe von unterschiedlichen CSS-Klassen auf. Für Tests brauche ich einen Selektor, der mir alle Elemente (li) ermittelt, die KEINE CSS-Klasse besitzen. <li class="active"></li> möchte ich beispielsweise nicht haben, sondern nur <li></li>. Leider konnte ich keinen Selektor finden, der dies ermöglicht. Das einzig funktionierende ist, alle nicht gewünschten Klassen mittels NOT auszuschließen: ul li:not(.active)

Allerdings keine schöne Lösung: Ich muss viele Klassen auflisten und habe eine hohe Fehleranfälligkeit, falls z.B. eine neue Klasse hinzugefügt wird. Gib es eine bessere Variante? ]]> CSS Benzol css-100/css-selektor-fuer-elemente-ohne-klasse-39690 CSS3 Selektor für div der h3-Element enthält css-100/css3-selektor-fuer-div-der-h3-element-enthaelt-38843?goto=newpost Sat, 20 Aug 2016 16:44:01 GMT Ich möchte CSS Regeln auf einen div anwenden, wenn dieser div ein bestimmtes Überschrift-Element enthält, z.B. ein h3. Beispiel: HTML:... Ich möchte CSS Regeln auf einen div anwenden, wenn dieser div ein bestimmtes Überschrift-Element enthält, z.B. ein h3.

Beispiel:
HTML-Code:
<div class=myclass">
    <h3>Test</h3>
    Inhalt
</div>
In diesem Beispiel möchte ich .myclass eine bestimmte Schriftgröße zuweisen, wenn darin eine h3 Überschrift enthalten ist. Wäre dort keine h3 Überschrift oder eine andere (h4 etwa), soll die Regel keine Anwendung finden. Was ich suche entspricht dem JQuery-Selektor $('.myclass:has(h3)'), Beispiel: 


$('.myclass:has(h3)').css('font-size', '16px');

Damit bekommt .myclass die Schriftgröße 16px, wenn ein h3-Element enthalten ist. Genau so etwas suche ich als reinen CSS-Selektor ohne Javascript, doch leider finde ich keinen passenden. Am nähesten kommt der Kind-Selektor (>). Das Problem ist aber, dass die Regel auf das zweite Element (h3) Anwendung findet, nicht auf das erste (.myclass). 


.myclass > h3 { font-size: 16px; }

Damit würde ich h3 auf Schriftgröße 16px setzen, nicht aber .myclass wie ich es brauche. Gibt es wirklich keine Möglichkeit, das ohne Javascript zu lösen? ]]> CSS DotNet css-100/css3-selektor-fuer-div-der-h3-element-enthaelt-38843 Website-Content mit Höhe des Browsers css-100/website-content-mit-hoehe-des-browsers-35270?goto=newpost Wed, 12 Nov 2014 22:58:20 GMT Hallo Ich habe zur Zeit ein Problem, welches ich nicht wirklich lösen kann. Deshalb suche ich hier nun Hilfe. Ich habe eine Seite, die einen... Hallo

Ich habe zur Zeit ein Problem, welches ich nicht wirklich lösen kann. Deshalb suche ich hier nun Hilfe.

Ich habe eine Seite, die einen Body von heigt: 100%; hat. Dort wird am Anfang etwas reingeladen und am Ende. Im Grunde also ein Seitenkopf und ein Seitenfuß. Die Höhe dieser ist dynamisch, die div-Container haben somit keine feste Höhe im CSS gesetzt.

Nun möchte ich alles, was sich dazwischen befindet, für den Hauptinhalt der Seite nutzen. Hier weiß ich jetzt nicht, wie ich das verwirklichen kann. Der Div des Inhalts kann ich keine Höhe von 100 Prozent setzen, da sich diese ja auf das übergeordnete Element bezieht, welches in meinem Fall <body> ist.

Versteht ihr meine Problematik? Ich habe im Internet nur Beispiele gefunden, welche mit fest gesetzter Höhe des Kopfes und des Fußes funktionieren. Darauf möchte ich aber möglichst verzichten.

Wäre geil, wenn ihr eine Antwort hättet. ]]> CSS xOneDirectionx css-100/website-content-mit-hoehe-des-browsers-35270 Tabelle mit CSS zentrieren css-100/tabelle-mit-css-zentrieren-33212?goto=newpost Thu, 05 Jun 2014 08:38:13 GMT Guten Morgen zusammen,
ich habe eine Tabelle die ich zentrieren möchte. Bisher habe ich es immer mit align="center" im HTML gemacht:
HTML-Code:
<table align="center">
ich würde es aber gerne mit CSS machen. Probiert habe ich es mit


table 

{

    text-align: center;

    margin-left: auto;

    margin-right: auto;

    margin-top: 0;

    margin-bottom: 0;

}


Es funktioniert aber nicht. Funktionieren tut es erst wenn ich der Tabelle eine Breite (width: 400px) zuweise. Das möchte ich aber nicht weil die Daten in der Tabelle dynamisch sind. Gibt es eine Möglichkeit Tabellen mit CSS zu zentrieren? ]]> CSS Benzol css-100/tabelle-mit-css-zentrieren-33212 <![CDATA[[CSS] Problem mit Padding]]> css-100/css-problem-mit-padding-28090?goto=newpost Thu, 14 Nov 2013 22:21:25 GMT Hallo!
Traurigerweise scheitere ich gerade bei den Grundlagen von CSS. lol^^

Folgender Quelltext:

Code:
<div id="head">
        <div id="headContainer">
                <div id="headLeft">x</div>
                <div id="headRight">y</div>
        </div>
</div>

#head {
        display: block;
        width: 100%;
        margin: 0px auto;
        padding: 10px 0 10px 0;
        background: #0D0D0D;
        border-bottom: 1px solid #0A0A0A;
}

#headContainer {
        display: block;
        width: 800px;
        margin: 0 auto;
        font-family: Tahoma;
        font-size: 17px;
        color: #FFF;
        background: red;
}

#headLeft {
        width: 250px;
        float: left;
        background: green;
}

#headRight {
        width: 550px;
        float: left;
        background: orange;
}
#headContainer sollte sich in #head befinden und ein padding von 10px haben(top, bottom).
Stattdessen wird #headContainer etwas unterhalb von #head angezeigt. Warum?

Preview: Title

Wenn ich allerdings #headLeft und #headRight aus #headContainer entferne, funktioniert es
genau so wie ich will, nur das es halt ein einzelner Container ist.

Siehe http://nethox.bplaced.net/cur2

MfG


Edit:
Ich will keine fixen height-Werte benutzen, sonst wäre das ganze ja kein Problem. ]]> CSS exception css-100/css-problem-mit-padding-28090 <![CDATA[[Problem]CSS -> Schrift sieht komisch aus.]]> css-100/problem-css-schrift-sieht-komisch-aus-27698?goto=newpost Mon, 28 Oct 2013 11:35:50 GMT Hi, ich würde gerne diesen schwarzen Schatten entfernen, aber weiß leider nicht was ich entfernen muss dafür. Sieht so aus (die komplette HP) ... Hi, ich würde gerne diesen schwarzen Schatten entfernen, aber weiß leider nicht was ich entfernen muss dafür. Sieht so aus (die komplette HP)

BILD ANZEIGEN [Warum wird das Bild nicht angezeigt?]

das ist die .css: https://mega.co.nz/#!Kg5FjBpb!NK-L-m...mYOF0OyyaQesEY


Kann mir das einer fixxen?


MfG ]]> CSS Klaus Bukkake css-100/problem-css-schrift-sieht-komisch-aus-27698 <![CDATA[[CSS] Zeilenumbruch verhindern]]> css-100/css-zeilenumbruch-verhindern-27449?goto=newpost Sat, 19 Oct 2013 14:11:30 GMT Hallo Leute, komme gerade nicht weiter. Folgender CSS-Code: PHP: --------- .sideBox { width: 230px; height: auto; Hallo Leute,
komme gerade nicht weiter.

Folgender CSS-Code:
PHP-Code:
.sideBox {
    width: 230px;
    height: auto;
    border-bottom: 6px solid #7109aa;
    border-top: 3px solid #252121;
    padding: 10px;
    padding-top: 15px;
    padding-bottom: 15px;
    background: #131111;
    font-family: courier;
    font-size: 13px;
    color: #FFF;
    margin-top: 30px;
}

.boxTitle {
    font-family: trebuchet ms;
    font-size: 15px;
    font-weight: bold;
} 
HTML:
PHP-Code:
<div class="boxTitle">&raquo; Letzte Themen im Forum</div>
         <hr style="border: 1px solid #252121; margin-bottom: 13px;" />        
        
         &bull; Threadtitel1337<br>
         &bull; Langer Threadtitel soll nicht breaken<br>
         &bull; Threadtitel1337<br>
         &bull; Langer Threadtitel soll..<br>
         &bull; Threadtitel1337
</div> 
Hier der Link dazu: tripping society

Es geht um die untere Box!

Ich bekomm's gerade irgendwie nicht hin, das bei längeren Thread-Titeln ein Zeilenumbruch verhindert wird
und der Text stattdessen einfach in den nicht sichtbaren Bereich der DIV weitergeht.

Mein Idee wäre ja das jeder Thread-Titel eine eigene div/span mit width 100% bekommt. Ich bilde mir
ein das es da irgendeine Eigenschaft gab damit der Text wie von mir gewünscht in's nicht sichtbare
weitergeh anstatt einen Zeilen umbruch zu erzeugen, oder irre ich mirch da?

Ich hoffe ihr versteht was ich meine xD
Mfg da ]]> CSS exception css-100/css-zeilenumbruch-verhindern-27449 <![CDATA[[CSS] Pure CSS Logo]]> css-100/css-pure-css-logo-26390?goto=newpost Wed, 11 Sep 2013 11:07:20 GMT Hallo, habe vorher meine alten Webdesign-Projekte durchstöbert und habe aufeinmal Lust bekommen mich wieder mal mit HTML/CSS3 zu beschäftigen.... Hallo,
habe vorher meine alten Webdesign-Projekte durchstöbert und habe aufeinmal Lust bekommen mich wieder mal
mit HTML/CSS3 zu beschäftigen. Rausgekommen ist ein Logo(oder auch ein Button) ohne einer einzigen Grafik.

Das hat natürlich seine Vorteile:
1.) Bessere Performance da keine Bilder geladen werden müssen
2.) Alles schnell und einfach per Code anpassbar(Text, Größe, Schriftformatierung, etc)

Und was ich Anfangs eigentlich garnicht glauben konnte ist, das im Internet Explorer 10 alles
ohne Probleme funktioniert! hihio

URL: Pure CSS Logo

Falls euer Browser die Font nicht erkennt hier ein Screen:
http://nethox.bplaced.net/pureCssLogo/logoscreen.png

Oder die Font direkt saugen:
http://nethox.bplaced.net/pureCssLogo/crixel.ttf


Feedback erwünscht hihio

greets ]]> CSS exception css-100/css-pure-css-logo-26390 width 100% Browser Scrollbar css-100/width-100-browser-scrollbar-25898?goto=newpost Thu, 22 Aug 2013 22:28:50 GMT Guten Abend U-Hacks'ler.

Ich bin aktuell am rumexperimentieren mit CSS. Das habe ich noch nie so wirklich beherscht und wollte das jetzt mal angehen.

Dabei folgendes:
Ich habe mir die CSS-Klasse body angelegt.
Darin ist ein Div-Container, dessen verknüpfte CSS-Klasse ich ganz stumpf mal wrapper genannt habe.

In diesem Content ist eine Liste, meine topnav. Dort liegen 5 ListItems drin, bei denen passt alles. Allerdings, sobald die ungeordnete Liste (<ul id="topnav">) definiert wurde, erscheint eine vertikale Scrollbar in jedem Browser. Scrolle ich diese ganz nach rechts, stell ich auch fest, dass es auch nicht komplett zentriert ist, wie es eigentlich sein sollte.

Ich hänge mal meine ganzen Dateien einfach mal an und hoffe, ihr könnt das nachvollziehen und mir helfen.





body 

{

	background-color: #D3D3D3;

	height: 100%;

	width: 100%;

	min-width: 800px;

}



#wrapper

{

	margin-left: auto;

	margin-right: auto;

	width: 90%;

	background-color: #000;

}



#topnav 

{

	width: 100%;

	overflow: auto;

	margin-left: auto;

	margin-right: auto;

	padding: 0;

	list-style-type: none;

}



#topnav a 

{

	font-family: Verdana;

	font-size: 14px;

	font-weight: bold;

	text-decoration: none;

	width: 100%;

	height: 25px;

	display: block;

	color: #000;

	background-color: #fff;

	text-align: center;

	line-height: 25px;

}



#topnav a:visited 

{

	color: #696969;

}



#topnav a:hover 

{

	background-color: #000;

	color: #fff;

}



#topnav li 

{

	width: 20%;

	float: left;

}



#pagecontent 

{

	width: 100%;

	min-height: 600px;

	background-color: #000;

	margin-top: -5px;

}


HTML-Code:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
        <title>Startseite</title>
        <link rel="stylesheet" href="styles/main.css" type="text/css"/>
</head>
<body>
        <div id="wrapper">
                <ul id="topnav">
                        <li><a href="index.html">Startseite</a></li>
                        <li><a href="register.html">Registrieren</a></li>
                        <li><a href="login.html">Login</a></li>
                        <li><a href="demo.html">Demo</a></li>
                        <li><a href="impressum.html">Impressum</a></li>
                </ul>
               
                <div id="pagecontent">
                       
                </div>
        </div>
</body>
</html>
Ist ein evtl. wenig unsauber, mache das am Ende alles raus. ]]> CSS xOneDirectionx css-100/width-100-browser-scrollbar-25898 Layout - Gleicher Spaltenabstand in Tabelle css-100/layout-gleicher-spaltenabstand-in-tabelle-24114?goto=newpost Mon, 03 Jun 2013 19:16:00 GMT Hey ! Vorab.. ich wusst enicht wirklich, wo ich das hier posten sollte.. Also falls es das falsche Sub ist, bitte verschieben. :-) Sooooo ! Ich... Hey ! Vorab.. ich wusst enicht wirklich, wo ich das hier posten sollte.. Also falls es das falsche Sub ist, bitte verschieben. :-)

Sooooo ! Ich hab da mal ein kleines Problem bezüglich des Layouts und zwar..
Mittel PHP hol ich mir Wert aus einer DB und gebe die schließlich als Tabelle aus.. Mit folgendem Code:
Spoiler:
PHP-Code:
$result = mysql_query("SELECT * FROM schueler WHERE Vorname = '".$_POST['Vorname']."' && Nachname = '".$_POST['Nachname']."'", $verbindung);[
echo '<table border="0">';
while ($row = mysql_fetch_array($result))
{
  echo "<tr>";
  echo "<td id='ausgabe'>". $row['ID'] . "</td>";
  echo "<td id='ausgabe'>". $row['Vorname'] . "</td>";
  echo "<td id='ausgabe'>". $row['Nachname'] . "</td>";
  echo "</tr>";
} 

Nun möchte ich, dass genau ober der Ausgabe: zum Beispiel ID Vorname Nachname steht und das aber in den selben Abständen wie bei der Ausgabe..

Hab das mal mit folgendem Code realisiert (mittel CSS eben alles verschoben usw..) , nur das Problem ist, dass wenn der Name z.B unterschiedlich lang ist, sich die Ausgabe verschiebt und somit passt es dann nicht mehr mit dem Layot von ID Vorname Nachname..
Spoiler:
PHP-Code:
echo '<table  border="0">';
echo "<tr>";
echo "<td id='schueler'>ID</td>";
echo "<td id='schueler'>Vorname</td>";
echo "<td id='schueler'>Nachname</td>";
echo "</tr>"; 


Gibt es da ne' effizientere Lösung, sodass die Abstände usw. immer gleich lang sind?

Lg, Saad. (Y) ]]> CSS Saad css-100/layout-gleicher-spaltenabstand-in-tabelle-24114 <![CDATA[[CSS] Kein Abstand mit margin]]> css-100/css-kein-abstand-mit-margin-18409?goto=newpost Wed, 28 Nov 2012 14:23:39 GMT Hey, ich möchte eine Linkliste mit Innen und Außenabstand machen. Weder margin noch padding Zeigen aber Wirkung, woran liegt das? Mein Testcode: ... Hey,
ich möchte eine Linkliste mit Innen und Außenabstand machen.
Weder margin noch padding Zeigen aber Wirkung, woran liegt das?
Mein Testcode:
Code:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title>Test</title>
</head>
<body>
<a href="#" style="border:solid 100px #000000; background-color:#dddddd; text-decoration:none; padding:100px;margin:120px;">testlink</a>
</span>
</body>
</html>
]]> CSS Minecraft css-100/css-kein-abstand-mit-margin-18409 Nützliche Links zum Thema CSS css-100/nuetzliche-links-zum-thema-css-18407?goto=newpost Wed, 28 Nov 2012 14:18:16 GMT Ich sammle gerade nützliche Seiten/Nachschlagewerke/etc zu CSS da ich mich damit gerade näher beschäftige. Meine Favouriten sind momentan... Ich sammle gerade nützliche Seiten/Nachschlagewerke/etc zu CSS da ich mich damit gerade näher beschäftige.

Meine Favouriten sind momentan folgende Seiten:

CSS 4 You - The Finest in Stylesheets
intensivstation :: CSS Templates
Stu Nicholls | CSSplay | CSS Demonstrations

Falls ihr noch andere habt würde ich mich freuen wenn ihr sie posten würdet. ]]> CSS Minecraft css-100/nuetzliche-links-zum-thema-css-18407 <![CDATA[[CSS] Negieren]]> css-100/css-negieren-18246?goto=newpost Thu, 22 Nov 2012 14:10:36 GMT Hey, ich formatiere alle Bilder auf meiner Seite in CSS mit Code: --------- img { .. } Hey,

ich formatiere alle Bilder auf meiner Seite in CSS mit

Code:
img {
..
}
Ein Bild will ich aber anders formatieren.
Kann ich irgendwie in CSS das negieren dass ich alle IMG Tags ausser die mit der Klasse xy formatieren kann? :8 ]]> CSS Minecraft css-100/css-negieren-18246 Suche Video2brain Videos für CSS css-100/suche-video2brain-videos-fuer-css-18211?goto=newpost Tue, 20 Nov 2012 22:11:16 GMT Hey , Leute könnt ihr mir eine paar Einsteiger Videos zu CSS von Video2brain empfehlen? wäre echt nett wenn jemand paar gute videos kennt für... Hey , Leute könnt ihr mir eine paar Einsteiger Videos zu CSS von Video2brain empfehlen?

wäre echt nett wenn jemand paar gute videos kennt für einsteiger


LG

Polskaboii ]]> CSS Polskaboii css-100/suche-video2brain-videos-fuer-css-18211 <![CDATA[[CSS] Problem mit text-align]]> css-100/css-problem-mit-text-align-17820?goto=newpost Mon, 05 Nov 2012 14:09:43 GMT Hallo, habe ein kleines Problem mit der text-positionierung in einer div. In der untersten Div(#footer) sollte der Text mittig sein. Im Firefox... Hallo,
habe ein kleines Problem mit der text-positionierung in einer div.
In der untersten Div(#footer) sollte der Text mittig sein. Im Firefox jedoch ist der Text nur irgendwie
komisch verschoben.(IE passt)

Wäre nett wenn sich das kurz wer anschauen kann :)

Code:

Spoiler:


Quelltext:

HTML-Code:
<html>
<head>
    <title>GEWI-Immobilien</title>
    <link rel="stylesheet" type="text/css" href="style.css">
</head>
<body>

<div id="head">
    <div id="logoContainer">
        GEWI<div class="slogan">IMMOBILIEN</div>
    </div>
    <div id="menuContainer">
        <a href="#">&raquo; About GEBI</a><br />
        <a href="#">&raquo; Immobilien</a><br />
        <a href="#">&raquo; Information</a><br />
        <a href="#">&raquo; Partner</a><br />
        <a href="#">&raquo; Kontakt</a><br />
    </div>
    <div id="slider1"></div>
</div>

<div id="mainContent">
    <div id="txtContent"></div>

    <div class="sideBox">
        <p>What's new?</p>
        Mauris volutpat ligula id urna facilisis elementum. Sed eros nisi, faucibus ac semper quis, volutpat sit amet velit.
    </div>
   
    <div class="sideBox">
        <p>Our Team</p>
        Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Proin lacinia posuere aliquet. Etiam pharetra justo sapien, sit amet interdum neque.
    </div>
   
    <div class="sideBox">
        <p>Contact us</p>
        Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Proin lacinia posuere aliquet. Etiam pharetra justo sapien, sit amet interdum neque.
    </div>
</div>

<div id="footer">GEWI Immobilien | Teststraße 13 | A-1220 Wien | 01/132874</div>







</body>
</html>
Stylesheet:

Code:
body {
    background: #FFFFFF;
    text-align: center;
    padding: 0px;
    margin: 0px;
}

#head {
    width: 800px;
    height: 130px;
    margin: 0 auto;
    border-bottom: 1px solid gray;
    padding-left: 5px;
    padding-right: 5px;
    margin-bottom: 8px;
}

#logoContainer {
    width: 140px;
    height: auto;
    background: #D1D1D1;
    color: #207ce5;
    font-size: 33px;
    font-family: Verdana;
    font-weight: bold;
    padding-top: 50px;
    padding-bottom: 10px;
    border: 1px solid #AEAFB0;
    border-top: none;
    float: left;
}

.slogan {
    font-size: 17px;
    font-family: MONOSPACE;
    font-weight: lighter;
    color: #647075;
}

#menuContainer {
    width: auto;
    height: 115px;
    float: left;
    margin-left: 25px;
    padding-top: 15px;
    text-align: left;
}

#menuContainer a {
    display: block;
    position: absolute;
    text-decoration: none;
    font-family: LUCIDA CONSOLE;
    font-size: 14px;
    color: #8D8E8F;
}

#menuContainer a:hover {
    color: #207ce5;
    font-weight: bold;
}

#slider1 {
    width: 500px;
    height: 100px;
    float: right;
    text-align: left;
    margin-top: 15px;
    border: 1px solid #ACADAD;
    background: url(img/head2.png);
}

#searchContainer img {
    width: 32px;
    height: 32px;
    float: left;
}

#mainContent {
    display: block;
    width: 800px;
    height: 443px;
    margin: 0 auto;
}

#footer {
    width: 800px;
    height: 25px;
    border-top: 1px solid gray;
    margin: 0 auto;
    text-align: center;
    position: relative;
}

#txtContent {
    display: block;
    float: left;
    width: 610px;
    height: 430px;
}

.sideBox {
    display: block;
    width: 170px;
    height: auto;
    background: #EBECED;
    float:right;
    clear: right;
    margin-bottom: 15px;
    border: 1px solid #919191;
    font-family: Tahoma;
    font-size: 13px;
    text-align: justify;
    padding: 5px;
}

.sideBox p {
    width: 172px;
    height: auto;
    margin-top: -5px;
    margin-left: -5px;
    margin-bottom: 3px;
    padding-top: 5px;
    padding-bottom: 5px;
    padding-left: 8px;
    text-align: left;
    background: #31A5D6;
    font-family: Verdana;
    font-size: 15px;
   
    background: rgb(73,155,234); /* Old browsers */
    background: -moz-linear-gradient(top,  rgba(73,155,234,1) 0%, rgba(32,124,229,1) 100%); /* FF3.6+ */
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(73,155,234,1)), color-stop(100%,rgba(32,124,229,1))); /* Chrome,Safari4+ */
    background: -webkit-linear-gradient(top,  rgba(73,155,234,1) 0%,rgba(32,124,229,1) 100%); /* Chrome10+,Safari5.1+ */
    background: -o-linear-gradient(top,  rgba(73,155,234,1) 0%,rgba(32,124,229,1) 100%); /* Opera 11.10+ */
    background: -ms-linear-gradient(top,  rgba(73,155,234,1) 0%,rgba(32,124,229,1) 100%); /* IE10+ */
    background: linear-gradient(to bottom,  rgba(73,155,234,1) 0%,rgba(32,124,229,1) 100%); /* W3C */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#499bea', endColorstr='#207ce5',GradientType=0 ); /* IE6-9 */
}


GEWI-Immobilien

LG ]]> CSS exception css-100/css-problem-mit-text-align-17820 Schrift in style.css gestalten css-100/schrift-in-style-css-gestalten-17551?goto=newpost Fri, 26 Oct 2012 18:54:29 GMT Hey Leute, bin gerade dabei ein persönliches Projekt auf die Beine zu stellen und hätte da mal kurz eine Frage. Bin, wie immer bei Wordpress-Themes,... Hey Leute,
bin gerade dabei ein persönliches Projekt auf die Beine zu stellen und hätte da mal kurz eine Frage. Bin, wie immer bei Wordpress-Themes, dabei das Theme zu übersetzen und mir ist dabei die style.css in die Finger gekommen. Ich wollte gleich mal die Schrift, welche auf der Homepage des Wordpress-Blogs zu sehen ist (bei den einzelnen Einträgen) vergrößern, den Zeilen-Abstand verändern und die Schrift fett machen. Die ersten zwei Dinge auf meiner Liste konnte ich selbst erledigen, jedoch bekomme ich den Befehl für das "fett" machen nicht hin. Habe natürlich Google schon befragt und auf selfhtml auch genügend Infomaterial dazu gefunden. Das Problem welches mir da nur im Weg steht ist, dass sie es anhand von reinem html-Code zeigen, wie es theoretisch funktionieren müsste. Da meine style.css jedoch anders strukturiert ist (einfacher?) komme ich mit den Begriffen wie "bold", "bolder" oder "font-size" nicht weiter. Vielleicht kennt sich ja jemand aus und kann mir da kurz weiterhelfen (:

Code:
body {
        font: 15px/20px Arial, serif;
        margin: 15;
        padding: 0;
        color: #333333;
        background-color: #fff;
}
Das ist der body, wo die Schrift für die "Homepage" deklariert wird. "margin" ist in diesem Fall der Zeilenabstand zwischen zwei Zeilen. Die "px" direkt hinter "font:" sind nach erfolgreichem Testen die Pixel der Schrift (also die Schriftgröße). Ich weiß nun leider nicht, wo ich Begriffe für das fett-machen einfügen soll.

Außerdem noch kurz eine Frage - kann ich in die style.css auch beispielsweise anstatt "Arial" einfach "Helvetica" einfügen und er übernimmt dann auf meiner Seite die Font automatisch oder muss ich da noch etwas machen? Nach mehrmaligen Testversuchen sah die Font nämlich immer nach Arial aus^^

Danke im Vorraus - Held ]]> CSS Cube!X css-100/schrift-in-style-css-gestalten-17551 <![CDATA[[CSS] Auto height]]> css-100/css-auto-height-16927?goto=newpost Mon, 01 Oct 2012 08:22:31 GMT Hallo, habe eine kleine Frage. Ich habe eine Div die auf height 100% gesetzt ist. Somit bedeckt sie ja den ganzen Bildschirm(vertikal). Mein... Hallo,
habe eine kleine Frage.

Ich habe eine Div die auf height 100% gesetzt ist. Somit bedeckt sie ja den ganzen Bildschirm(vertikal). Mein Problem ist, dass
wenn der Text über den Bildschirmrand hinausgeht, sich die Div nicht mitvergrößert.

Zum Verständniss:

HTML-Code:
<html>
<head>
    <title>Welcome</title>
    <link rel="stylesheet" type="text/css" href="style.css">
</head>
<body>


<div id="content">

Die CSS3-Eigenschaft bietet viele, viele Möglichkeiten einem Webdesign ohne den Einsatz von Bildern eine professionelle Plastizität zu verleihen. Leider können IE-Nutzer diese Effekte (ohne Einsatz von jQuery-Lösungen) nicht sehen. Wie so oft muss der Webdesigner also abwägen, wo wann und wieviel diese Eigenschaften verwendet werden.
Die CSS3-Eigenschaft bietet viele, viele Möglichkeiten einem Webdesign ohne den Einsatz von Bildern eine professionelle Plastizität zu verleihen. Leider können IE-Nutzer diese Effekte (ohne Einsatz von jQuery-Lösungen) nicht sehen. Wie so oft muss der Webdesigner also abwägen, wo wann und wieviel diese Eigenschaften verwendet werden.
Die CSS3-Eigenschaft bietet viele, viele Möglichkeiten einem Webdesign ohne den Einsatz von Bildern eine professionelle Plastizität zu verleihen. Leider können IE-Nutzer diese Effekte (ohne Einsatz von jQuery-Lösungen) nicht sehen. Wie so oft muss der Webdesigner also abwägen, wo wann und wieviel diese Eigenschaften verwendet werden.
Die CSS3-Eigenschaft bietet viele, viele Möglichkeiten einem Webdesign ohne den Einsatz von Bildern eine professionelle Plastizität zu verleihen. Leider können IE-Nutzer diese Effekte (ohne Einsatz von jQuery-Lösungen) nicht sehen. Wie so oft muss der Webdesigner also abwägen, wo wann und wieviel diese Eigenschaften verwendet werden.
Die CSS3-Eigenschaft bietet viele, viele Möglichkeiten einem Webdesign ohne den Einsatz von Bildern eine professionelle Plastizität zu verleihen. Leider können IE-Nutzer diese Effekte (ohne Einsatz von jQuery-Lösungen) nicht sehen. Wie so oft muss der Webdesigner also abwägen, wo wann und wieviel diese Eigenschaften verwendet werden.
Die CSS3-Eigenschaft bietet viele, viele Möglichkeiten einem Webdesign ohne den Einsatz von Bildern eine professionelle Plastizität zu verleihen. Leider können IE-Nutzer diese Effekte (ohne Einsatz von jQuery-Lösungen) nicht sehen. Wie so oft muss der Webdesigner also abwägen, wo wann und wieviel diese Eigenschaften verwendet werden.
Die CSS3-Eigenschaft bietet viele, viele Möglichkeiten einem Webdesign ohne den Einsatz von Bildern eine professionelle Plastizität zu verleihen. Leider können IE-Nutzer diese Effekte (ohne Einsatz von jQuery-Lösungen) nicht sehen. Wie so oft muss der Webdesigner also abwägen, wo wann und wieviel diese Eigenschaften verwendet werden.
Die CSS3-Eigenschaft bietet viele, viele Möglichkeiten einem Webdesign ohne den Einsatz von Bildern eine professionelle Plastizität zu verleihen. Leider können IE-Nutzer diese Effekte (ohne Einsatz von jQuery-Lösungen) nicht sehen. Wie so oft muss der Webdesigner also abwägen, wo wann und wieviel diese Eigenschaften verwendet werden.
Die CSS3-Eigenschaft bietet viele, viele Möglichkeiten einem Webdesign ohne den Einsatz von Bildern eine professionelle Plastizität zu verleihen. Leider können IE-Nutzer diese Effekte (ohne Einsatz von jQuery-Lösungen) nicht sehen. Wie so oft muss der Webdesigner also abwägen, wo wann und wieviel diese Eigenschaften verwendet werden.


</div>


</body>
</html>
CSS:
Code:

body {
    margin: 0;
    padding: 0;
    background: #242424;
    text-align: center;
}

#content {
    width: 750px;
    height: 100%;
    background: #FFFFFF;
    margin: 0 auto;
    border-left: 1px solid #999999;
    border-right: 1px solid #999999;
    font-size: 36px;
}
Preview zu Demozwecken: http://dope.bplaced.net/new/

Im Google habe ich eigentlich nicht wirklich was hilfreiches gefunden.

MfG

Moderator-Hinweis: Quellcode bitte zukünftig direkt im Thread mit dem code-Tag posten und nicht verlinken! ]]> CSS exception css-100/css-auto-height-16927 Cursor Crosshair - Wie funktioniert das? css-100/cursor-crosshair-wie-funktioniert-das-16152?goto=newpost Sat, 08 Sep 2012 10:29:32 GMT Hallo, ich würde gerne in einer externen CSS Datei, den Cursor festlegen. Als erstes hab ich folgendes probiert: HTML: --------- body { Hallo,

ich würde gerne in einer externen CSS Datei,
den Cursor festlegen.

Als erstes hab ich folgendes probiert:
HTML-Code:
body {
{cursor:crosshair};
}
Das funktioniert leider nicht.

Dann hab ich ohne einen Bereich einfach mal in die CSS Datei:

HTML-Code:
body{cursor:crosshair};a:hover{cursor:crosshair;}
geschrieben.

Funktioniert leider auch nicht.

Kann mir jemand sagen was ich da falsch mache? ]]> CSS !lkay css-100/cursor-crosshair-wie-funktioniert-das-16152 CSS bewerten + Verbesserungsvorschläge css-100/css-bewerten-verbesserungsvorschlaege-15650?goto=newpost Thu, 16 Aug 2012 12:24:20 GMT Hey, ich habe angefangen CSS zu lernen und mache nun mein erstes "ernsthaftes" Projekt und wollte fragen wie euch das Design gefällt & was ich noch besser machen kann. Es geht dabei um einen Itemshop für Onlinegames wie z.B. Minecraft.

LG

]]> CSS Snees css-100/css-bewerten-verbesserungsvorschlaege-15650 3D CSS Text Generator css-100/3d-css-text-generator-15346?goto=newpost Fri, 03 Aug 2012 16:46:16 GMT Hey, vor ein paar Tagen durch Zufall gefunden, finde es persönlich echt hilfreich. Evtl. kann es jemand gebrauchen / kannte es noch nicht. LG ... Hey, vor ein paar Tagen durch Zufall gefunden,
finde es persönlich echt hilfreich.

Evtl. kann es jemand gebrauchen / kannte es noch nicht.
LG

3D CSS Text Generator ]]> CSS Snees css-100/3d-css-text-generator-15346 <![CDATA[[CSS] Windows-Style Fenster]]> css-100/css-windows-style-fenster-15135?goto=newpost Sat, 28 Jul 2012 19:38:33 GMT Hoi! Brauchte das für ein eigenes meiner kleineren Projekte. Eventuell kann ja der ein oder andere damit was anfangen :) Screenshot: Bild:... Hoi!

Brauchte das für ein eigenes meiner kleineren Projekte. Eventuell kann ja der ein oder andere damit was anfangen :)

Screenshot:
Spoiler:


Die komplette Box ist von der Breite und Höhe her anpassbar. Wird automatisch mitwachsen (kann man also auch per JavaScript resizable machen!).

Die Box an sich hab ich mit ein paar "Extras" ausgeschmückt. Dazu zählt das Icon, der Closed-Button sowie unten der blaue Bereich (Footer). Diese Teile sind im Code folgendermaßen beschrieben:

HTML-Code:
<!-- Icon -->
<div class="windowsBoxIcon"><img src="img/icon.png" alt="Icon" title="Icon"></div>

<!-- Button -->
<div class="closeButton">x</div>

<!-- Blauer Bereich unten (Footer) -->
<div class="footer"></div>
Diese kann man ohne Probleme rausnehmen. Die Box an sich wird dadurch nicht verändert.

(Da der U-Hacks Attachment Upload ja noch immer nicht funktioniert.. Hier der Link):

win_window.rar - Localhostr

MfG ]]> CSS Comu css-100/css-windows-style-fenster-15135 Wordpress Theme Abstand verändern css-100/wordpress-theme-abstand-veraendern-10081?goto=newpost Sun, 01 Apr 2012 17:24:54 GMT Hey! Ich habe einen Wordpress Blog mit dem Design Trendy, also das hier: WordPress Deutschland Themepool » Trendy (http://themes.wpde.org/trendy/)... Hey!
Ich habe einen Wordpress Blog mit dem Design Trendy, also das hier: WordPress Deutschland Themepool » Trendy
Auf dem Screen sieht man dass der Inhalt zentriert ist und links und rechts viel Abstand vom Bildschirmrand da ist (die schwarzen Streifen).
Diese schwarzen Streifen will ich kleiner machen, damit der Inhalt mehr Platz hat (also breiter wird).

Ich weiß dass ich das in der CSS Datei ändern muss. Hab auch schon bisschen probiert aber habs noch nicht geschafft :/

Kann mir vielleicht jemand helfen?
Die gesamte Seite ist im div Container "container".
Die CSS Datei:

Code:

/*
Theme Name: Trendy
Theme URI: http://benediktrb.de
Description: Trendy von <a href="http://benediktrb.de">Benedikt</a>
Version: 1.0
Author: Benedikt Rieke-Benninghaus
*/

/* ------------------------------------------------------------------------------- Definitions */

* {margin: 0; padding: 0; border: none; outline:none;}

body {
        margin: 0;
        padding: 0;
        background: #121212 url(images/background.gif) repeat-x top left;
        font-family: "Arial", Lucida Grande, Verdana, Helvetica, sans-serif;
        font-size: 80%;
        color: #FFFFFF;
        text-align: left;
}


h1,h2,h3,h4,h5,h6 {
        font-family: "Arial", Verdana, sans-serif;
        font-weight: normal;
        padding:0;
        margin:0;
        color:#F5F5F5;
}

a:link, a:visited { color: #6D9212; text-decoration: none;}

a:hover, a:active {color: #A4D03B; text-decoration: underline;}

.nodisplay {left: -5000px; position: absolute;}

p, ul, ol {line-height: 23px;}

ol, ul {list-style-type: square; padding:5px 0 0 20px}


/* -------------------------------------------------------------------------------- Containerproperties */
#container {
        background:transparent;
        margin:0 auto;
        padding:0;
        width:768px;
}

#header {
        background: #1E1E1E url(images/logo.gif) no-repeat top center;
        height: 143px;
        width:768px;
        margin: 0; padding: 0;
}

#menu {
        width:768px;
        height:50px;
        background: #1E1E1E url(images/button_bg.gif) no-repeat top center;
        text-align: left;
}

#buttons {
        width:768px;
        height:29px;
        background: #1E1E1E url(images/u_head.gif) no-repeat top center;
        text-align: right;
}

#content {
        background: transparent url(images/corner.jpg) no-repeat top left;
          float: left;
          width: 500px;
        padding:15px;
}

#navigation {
          float: right;
        margin: 8px 8px 8px 0px;
        padding: 10px;
          width: 200px;
        line-height: 1.5em;
        display: inline;
}

#footer {
        background: #1E1E1E url(images/footer.jpg) no-repeat top center;
        height: 45px;
        width:768px;
        margin: 0; padding: 0;
}


/* ------------------------------------------------------------------------------------------- Header */

#header h1 {
        color:#fff;
        float:left;
        margin: 36px 0 0 70px;
        padding: 0;
        clear:right;
        font-size:2.5em;
}

#header h1 a, #header h1 a:hover {
        color:#fff;
        text-decoration:none;
}

#menu ul {
        font-weight:bold;
        padding: 8px 0 0 50px;
}
#menu li {
        padding: 0 10px 0 5px;
        display: inline;
}
#menu li a {
        color: #B8D518;
}
#menu li a:hover {
        border-top:3px solid #C6E51E;
        text-decoration: none;
        color: #D3F519;
}

#buttons ul {
        font-size:11px;
        font-weight:bold;
        padding: 2px 10px 0 0;
}
#buttons li {
        background: transparent url(images/rss.gif) no-repeat 0px 50%;
        padding: 0 10px 0 20px;
        display: inline;
}
#buttons li a {
        color: #fff;
}
#buttons li a:hover {
        text-decoration: none;
        color: #EFEFEF;
}

/* ------------------------------------------------------------------------------------- right Sidebar */


#navigation h2 {
        margin: 5px 0 8px 0;
        padding: 0 0 4px 0;
        color: #F5F5F5;
        font-size: 20px;
        border-bottom: 2px solid #A7D23F;
}

#navigation ul {
        margin: 0 0 20px 0;
        padding: 0;
        list-style: none;
}

#navigation ul li {
        margin: 0;
        padding: 0
        display: inline;
}

#navigation li {
        list-style: none;
}

#navigation ul li a {
        margin: 0;
        padding: 4px 0 4px 30px;
        background:transparent url(images/bull.gif) no-repeat 10px 50%;
        display: block;
        color: #fff;
        text-decoration: none;
}


#navigation ul li a:hover {
        background:#1A1A1A url(images/bull_h.gif) no-repeat 10px 50%;
        color: #fff;
}

#navigation .box {
        margin:10px 0 10px 0;
        padding:8px;
        background: transparent url(images/navi.gif) no-repeat top left;
}

/* --------------------------------------------------------------------------------------- Content Area */

.article {
        margin: 25px 0 0 0;
        padding:15px;
}

.headline {
        clear:both;
}

.article h2 {
        float:left;
        margin: 0 0 10px 0;
        font-size: 22px;
        border-bottom:1px dotted #fff;
}


.article h2 a:link,
.article h2 a:visited {
        color:#F5F5F5;
        padding: 4px;
        text-decoration: none;
}

.article h2 a:hover,
.article h2 a:active {
        color: #E6E6E6;
        padding: 4px;
}

.comments {
        float:right;
        text-align:left;
        font-weight:bold;
        padding: 4px 4px 4px 33px;
        background: transparent url(images/comments.gif) no-repeat 5px 50%;
}

#content .postmetadata,
#content .thecontent {
        margin: 15px 0 0 0;
}

#content .postmetadata {
        background: #121212 url(images/postmeta.gif) no-repeat top left;
          float: left;
          width: 485px;
        height:44px;
        margin:10px 0 15px 0;
}
#content .postmetadata p{
        color:#000;
        font-size:11px;
        font-weight:bold;
        padding:10px;
}

#content .postmetadata p a{
        color:#000;
}
#content .postmetadata p a:hover{
        color:#3D4141;
}

#content blockquote {
        background: #121212 url(images/quote.gif) no-repeat top left;
          padding: 0 0 0 45px;
          margin: 5px 5px 5px 20px;
        min-height:40px;
}

#content code {
        background: #121212 url(images/code.gif) no-repeat top left;
          padding: 0 0 0 20px;
          margin: 5px 5px 5px 20px;
        min-height:40px;
}

.searcherg {
          padding: 5px;
          margin: 5px 5px 5px 20px;
          border-left: 4px solid #84A439;
}

/* ----------------------------------------------------------------------------------------- Content Icons */

.goon {
        background: transparent url(images/link.gif) no-repeat 0px 50%;
        padding:0 0 0 15px;
        font-weight: bold;
}

.thecontent {
        clear:both;
        margin: 15px 0 0 0;
}

.thecontent p{
        margin: 10px 0 0 0;
}

/* ------------------------------------------------------------------------------------- Comment Area */

.comment {
        margin: 40px 0 0 0;
}

.comment h3 {
        color:#fff;
        padding: 10px;
        font-size: 20px;
}

.comment h4 {
        color:#fff;
        margin: 15px 0 10px 0;
        padding: 0 0 0 5px;
        font-size: 20px;
}

.service {
        margin: 0 0 20px 0;
        padding: 3px;
        background: #1A1F28;
        font-weight: bold;
}

.comment input,textarea {
          margin: 2px;
          padding: 4px;
          background: #2F2F2F;
          color: #BFBFBF;
          border: 2px solid #252525;
}

.comment textarea {
          width: 80%;
          height: 150px;
}

.comment input:focus,
.comment textarea: focus {
          background: #141414;
}

.comment input[type=submit] {
          font-weight: bold;
}

.comment ol.commentlist {
          margin: 5px;
          padding: 10px;
          list-style-type: none;
}

.comment ol.commentlist li {
          margin: 7px;
          padding: 10px;
}

.kommentar {
        padding: 4px 0 2px 6px;
        margin: 5px 0 5px 5px;
}

.gravatar {
        max-width: 50px;
        max-height: 50px;
}

/* ------------------------------------------------------------------------------------------------ Footer */

#footer p {
        padding:12px;
        font-size: 12px;
        text-align: left;
        color: #fff;
}


/* ------------------------------------------------------------------------------------------------------- */
]]> CSS Essah css-100/wordpress-theme-abstand-veraendern-10081 Mybb Logo verschieben css-100/mybb-logo-verschieben-7228?goto=newpost Wed, 15 Feb 2012 08:45:01 GMT Hallo User, ich hatte da eine frage. Wie verschiebe ich das logo also die img, auf der richtigen stelle. Also das logo von mybb Forum, ist... Hallo User,

ich hatte da eine frage. Wie verschiebe ich das logo also die img, auf der richtigen stelle.


Also das logo von mybb Forum, ist sagen wir auf diese Stelle


............ Stelle

Aber soll auf dieser stelle stehen

.................. Stelle wie mache ich das ]]> CSS Kosi css-100/mybb-logo-verschieben-7228 <![CDATA[[CSS] Unterseiten einbinden]]> css-100/css-unterseiten-einbinden-4044?goto=newpost Mon, 02 Jan 2012 16:19:56 GMT ]]> Hallo,

Ich suche hilfe bei folgenden:

Ich habe den CSS code:

HTML-Code:
<div id="design">
<div id="header">
<h1 class="hptitle">Bazs-Production</h1>
<h2 class="slogan">Rappenlernen leicht gemacht!.</h2>
</div>

<div id="main">
<div id="menu">
<div id="menu_items">
<a href="http://bazs-production.de.tl/Home.htm">»  Startseite</a>
<a href="http://bazs-production.de.tl/2011-Rap-Tutorials.htm">»  2011 Rap Tutorials</a>
<a href="http://bazs-production.de.tl/Kontakt.htm">»  Kontaktformular</a>
<a href="http://bazs-production.de.tl/Forum/index.htm">»  Forum</a>
<a href="http://bazs-production.de.tl/Login.htm">»  Login</a>
</div></div>

<div id="box">
<div id="btop"></div>
<div id="bbg">
<h1>Navigation</h1>
<h2>Bitte wählen</h2>
<br />

<div id="box_items">
<a href="http://bazs-production.de.tl/Home.htm">»  Startseite</a>
<a href="http://bazs-production.de.tl/2011-Rap-Tutorials.htm">»  2011 Rap Tutorials</a>
<a href="http://bazs-production.de.tl/Kontakt.htm">»  Kontaktformular</a>
<a href="http://bazs-production.de.tl/Forum/index.htm">»  Forum</a>
<a href="http://bazs-production.de.tl/Login.htm">»  Login</a>
</div>
<br />
<h1>Neuigkeiten</h1>
<h2>Aktuelles</h2>
<p>Homepage endlich Online !!!!!</p>
<br />
<h1>Partner</h1>
<h2>von Homepage</h2>
<br />
<div id="box_items">
<a href="#">»  Partner 1</a>
<a href="#">»  Partner 2</a>
<a href="#">»  Partner 3</a>
<a href="#">»  Partner 4</a>
<a href="http://bazs-production.de.tl/Bewirb-dich-ar--ar-.htm">»  Bewirb dich!!</a>
</div>
<br />
</div>
<div id="bbottom"></div>
</div>

<div id="ctop"></div>
<div id="subpage"><h1>Bazs-Production</h1></div>

und nun suche ich dafür den Code für Unterseiten.

Es gibt bei 2011 Rap Tutorials Unterseiten, die ich gern nachdem man dort drauf geht auch sieht.

könnte einer den einfügen oder mir den code schicken und mir schreiben wo der rein soll?

wäre nett.

lg Bazs ]]> CSS Bazs css-100/css-unterseiten-einbinden-4044 U-Hacks-Logo in CSS3 css-100/u-hacks-logo-in-css3-1629?goto=newpost Thu, 01 Dec 2011 21:31:53 GMT HHatte die Fonts nicht da und hab irgendwelche passenden rausgesucht um weiterarbeiten zu können, wenn UH will, können die das ja tauschen, mach... HHatte die Fonts nicht da und hab irgendwelche passenden rausgesucht um weiterarbeiten zu können, wenn UH will, können die das ja tauschen, mach Anpassungen leichter, zusätzliche Effekte können mal eben mit 2 Zeilen Code eingebaut werden etc., find ich ne edlere Lösung als ein Bild...

Btw. ich weiß das da bei dem 'U-Hacks' ein Vertical Radial fehlt, der wird aber noch nicht unterstützt in Firefox, nur in irgendnem anderen Browser, also wayne... werde das später dann evtl. anpassen

Vorschau (nur für Mozilla, kb mehr gehabt die anderen Tags da einzufügen):
http://k-scene.net/uhlogo/

Quelltext:
HTML-Code:
<!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>
        <style type="text/css">
        #bg{
                background: -moz-radial-gradient(171px 30px, cover, #53626D, #374148);       
                width:400px;
                height:122px;
                box-shadow:inset -5px -5px 1px #17191A, inset -10px -10px 1px #31393E,  inset -12px -12px 1px #333536;
        }
        #uhBox{
                padding:0px;
                margin:0px;
                background: -moz-radial-gradient(50% 50%, cover, #FFF, #888888);       
                width:50px;
                height:50px;
                top:50px;
                left:20px;
                position:absolute;
                box-shadow:inset -1px -1px 5px #FFF,  1px 1px 6px #000;       
                font-family: Letters, sans-serif;
                font-size:2.2em;
        }

        #uhBox #uLetter{
                top:-3px;
                left:3px;
                position:absolute;
                color:#2E2E2E;
                text-shadow:  -1px -1px 1px #000,1px -1px 1px #6F6F6F;
        }
        #uhBox #hLetter{
                left:27px;
                top:15px;
                position:absolute;
                color:#D28DE9;
                text-shadow:  -1px -1px 1px #825990,1px -1px 1px #FFF;
        }

        #u{
                font-family: UHLogo, sans-serif;
                font-size:2.8em;
                font-weight:bold;
                left:85px;
                top:35px;
                position:absolute;
                text-shadow:  3px 3px 1px #000, -3px -3px 1px #000, -3px 3px 1px #000, 3px -3px 1px #000, 3px 3px 5px #000;
                color:#999999;
        }

        #hacks{
                font-family: UHLogo, sans-serif;
                font-size:2.8em;
                font-weight:bold;
                position:absolute;
                top:35px;
                left:140px;
                color:#CE8AE5;
                text-shadow:  3px 3px 1px #000, -3px -3px 1px #000, -3px 3px 1px #000, 3px -3px 1px #000, 3px 3px 5px #000;

        }

        #net{
                font-family: net, sans-serif;
                position:absolute;
                top:68px;
                left:285px;
                color:#A4A4A4;
                text-shadow: 3px 3px 3px #000;
        }

        #v2{
                font-family: UHLogo, sans-serif;
                left:285px;
                top:39px;
                font-weight:bold;
                position:absolute;
                color:#C89FD7;
                text-shadow: 3px 3px 2px #000;
        }

        #gradientline{
                background: -moz-radial-gradient(50% 50%, farthest-side, rgba(247,209,255,255), rgba(0,0,0,0));
                width:250px;
                height:7px;
                top:111px;
                left:75px;
                position:absolute;
        }

        #motto{
                position:absolute;
                font-family: motto, sans-serif;
                font-size:0.8em;
                color:white;
                font-weight:lighter;
                left:85px;
                top:96px;
                text-shadow: 3px 3px 1px #000;
        }

        @font-face{
                font-family: Letters;
                src: url('http://k-scene.net/uhlogo/imagine_font.ttf');
        }
        @font-face{
                font-family: UHLogo;
                src: url('http://k-scene.net/uhlogo/uhacks-DustHomeMedium.ttf');
        }
        @font-face{
                font-family: net;
                src: url('http://k-scene.net/uhlogo/dotnet-Cyrivendell.ttf');
        }
        @font-face{
                font-family: v2;
                src: url('http://k-scene.net/uhlogo/dotnet-Cyrivendell.ttf');
        }
        @font-face{
                font-family: motto;
                src: url('http://k-scene.net/uhlogo/motto-visitor1.ttf');
        }

        </style>
        </head>
        <body>
                <div id="bg">
                        <div id="uhBox">
                                <div id="uLetter">U</div>
                                <div id="hLetter">H</div>
                        </div>
                        <div id="u">
                                U-
                        </div>
                        <div id="hacks">               
                                HACKS
                        </div>       
                        <div id="net">
                                .net
                        </div>
                        <div id="v2">
                                V2
                        </div>
                        <div id="motto">No #1 HACKING SOURCE | UNITED TO HACK</div>
                        <div id="gradientline"></div>       
                </div>
        </body>
</html>
]]> CSS Sky.NET css-100/u-hacks-logo-in-css3-1629