Seite 1 von 1
CSS Platzierung, böse Browser
Verfasst: 29.01.2006, 22:33
von ypsie
Guten Abend,
Code: Alles auswählen
<html>
<head>
<meta http-equiv="inhalt-type" inhalt="text/html; charset=utf-8" />
<link rel="stylesheet" type="text/css" href="style.css"/>
<title>eurwf kjerfjre kf,ge jerbj</title>
</head>
<body>
<a href="index.html"><img src="logo-super.jpg" alt="eurwf kjerfjre kf,ge jerbj
erk" width="781" height="160" border="0" class="header"/></a>
<ul>
<li class="akt"><a href="#">Startseite</a></li>
<li><a href="#">Seite1</a></li>
<li><a href="#">Seite2</a></li>
<li><a href="#">Seite3</a></li>
<li><a href="#">Seite4</a></li>
<li><a href="#">Seite5</a></li>
<li><a href="#">Seite6</a></li>
</ul>
<div class="inhalt">
<h1>eurwf kjerfjre kf,ge jerbj</h1>
<p><img src="os2.jpg" width="130" height="86" /> eurwf kjerfjre kf,ge jerbj
erk eurwf kjerfjre kf,ge jerbj erk eurwf kjerfjre kf,ge jerbj erk eurwf kjerfjre
kf,ge jerbj erk eurwf kjerfjre kf,ge jerbj erk eurwf kjerfjre kf,ge jerbj
erk eurwf kjerfjre kf,ge jerbj erk eurwf kjerfjre kf,ge jerbj erk eurwf kjerfjre
kf,ge jerbj erk eurwf kjerfjre kf,ge jerbj erk eurwf kjerfjre kf,ge jerbj
erk eurwf kjerfjre kf,ge jerbj erk eurwf kjerfjre kf,ge jerbj erk eurwf kjerfjre
kf,ge jerbj erk eurwf kjerfjre kf,ge jerbj erk eurwf kjerfjre kf,ge jerbj
erk eurwf kjerfjre kf,ge jerbj erk eurwf kjerfjre kf,ge jerbj erk eurwf kjerfjre
kf,ge jerbj erk eurwf kjerfjre kf,ge jerbj erk eurwf kjerfjre kf,ge jerbj
erk eurwf kjerfjre kf,ge jerbj erk eurwf kjerfjre kf,ge jerbj erk eurwf kjerfjre
kf,ge jerbj erk eurwf kjerfjre kf,ge jerbj erk eurwf kjerfjre kf,ge jerbj
erk eurwf kjerfjre kf,ge jerbj erk eurwf kjerfjre kf,ge jerbj erk eurwf kjerfjre
kf,ge jerbj erk eurwf kjerfjre kf,ge jerbj erk </p>
</div>
</body>
</html>
Code: Alles auswählen
body {
margin: 0px;
padding: 0px;
font-family: Verdana;
font-size: 12px;
background: #ffffff;
color: #032958;
}
.header {
margin-top: 10px;
}
ul {
position:absolute;
left:10px; top:180px;
padding: 0px;
margin: 0px;
list-style: none;
width: 160px;
}
li a{
font-weight: bold;
text-decoration: none;
color: #032958;
display: block;
padding: 8px;
border-left: 4px solid #C1E6F8;
border-right: 4px solid #C1E6F8;
margin-bottom: 10px;
}
.akt a, li a:hover {
background: #C1E6F8;
color: #286ea0;
border-left: 4px solid #2DA9D9;
border-right: 4px solid #2DA9D9;
}
.inhalt {
position:absolute;
left:200px; top:180px;
width: 611px;
border-right: 20px solid #D2EDFA;
padding-right: 20px;
line-height: 20px;
}
.inhalt a {
text-decoration: underline;
color: #015A85;
padding: 3px 3px 3px 3px;
}
.inhalt a:hover {
text-decoration: underline;
color: #ffffff;
background-color: #015A85;
padding: 3px 3px 3px 3px;
}
.inhalt img {
border: 2px dashed #2DA9D9;
float: left;
margin: 0px 10px 0px 0px;
}
a img {
border: 0;
}
h1 {
font-size: 16px;
margin: 0px;
padding: 0px;
color: #032958;
}
Ich will, dass der rechte Border des Inhalts mit dem Header oben abschließt.
Also eine Linie bilden, wenn ihr wisst, was ich meine. Kein Abstand nach rechts oder links.
Bitte um Hilfe!
lg, julian
Verfasst:
von
Hochwertiger Linkaufbau bei ABAKUS:
- Google-konformer Linkaufbau
- nachhaltiges Ranking
- Linkbuilding Angebote zu fairen Preisen
- internationale Backlinks
Wir bieten
Beratung und
Umsetzung.
Jetzt anfragen:
0511 / 300325-0
CSS Platzierung, böse Browser
Verfasst: 29.01.2006, 23:16
von Fluidum
Das was du da macht ist völliger Unsinn...
Du machst da völlig unnötige Sachen, lies etwas mehr zur Semantik von Markup und CSS!
Wenn ich Morgen Zeit habe, dann überarbeite ich dir das mal...
Verfasst: 29.01.2006, 23:41
von Fluidum
Ich konnte doch nicht ganz die Finger davon lassen... Hier mal ein Anfang wie es aussehen sollte!
Ich hab es auch mal etwas farblich dargestellt, damit du es besser sehen kannst, musst du dann noch ändern...
Den Rest musst du dann mal selber zusammen basteln!
Code: Alles auswählen
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Unbenanntes Dokument</title>
<style type="text/css">
<!--
* {
padding: 0;
margin: 0;
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 90%;
}
div#wrap {
width: 781px;
background-image: url(/logo-super.jpg);
background-repeat: no-repeat;
padding-top: 160px;
}
div#sidebar {
float: left;
background-color: #009999;
width: 200px;
}
div#content {
float: right;
background-color: #FF9900;
width: 581px;
}
-->
</style>
</head>
<body>
<div id="wrap">
<div id="sidebar">
<p>tzjtzj tzj tzjtzj tjtz jtzj tzjtjtjtzjt tzjtz tzj tzj</p>
<p>fgnfgn z hjtzjtzjtzj ztjtzj tzjjzt tj tzj tzj tzjtz ztj</p>
<p>fgn ztjj tzjtzj tzjtzj tzjtzj tjzt jztj tzj </p>
<p>fgn zhj tjtzj tjtzjtzjt tzj tzjtzj tzjtzj tzj tzj </p>
</div><!-- end.sidebar -->
<div id="content">
<p>tzjtzj tzj tzjtzj tjtz jtzj tzjtjtjtzjt tzjtz tzj tzj</p>
<p>fgnfgn z hjtzjtzjtzj ztjtzj tzjjzt tj tzj tzj tzjtz ztj</p>
<p>fgn ztjj tzjtzj tzjtzj tzjtzj tjzt jztj tzj </p>
<p>fgn zhj tjtzj tjtzjtzjt tzj tzjtzj tzjtzj tzj tzj </p>
</div><!-- end.content -->
</div><!-- end.wrap -->
</body>
</html>
P.S.: Wenn du schon so einen kleinen Bereich (781 Pixel) wählst, dann würde ich es gleich einen Tick kleiner machen (760 Pixel), dann passt es nämlich auch bei einem 15" Monitor bei einer Auflösung von 800x600 Pixel
Verfasst:
von
Content Erstellung von
ABAKUS Internet Marketing
Ihre Vorteile:
- einzigartige Texte
- suchmaschinenoptimierte Inhalte
- eine sinnvolle Content-Strategie
- Beratung und Umsetzung
Jetzt anfragen:
0511 / 300325-0
CSS Platzierung, böse Browser
Verfasst: 29.01.2006, 23:44
von marquis
Und dann noch kurzsschrift im css
und dann wirds schon...
bg
m
CSS Platzierung, böse Browser
Verfasst: 29.01.2006, 23:47
von Fluidum
Und vergiss den IE.... Die Seiten immer zuerst im FireFox und Opera testen und dann im Internet Explorer!!!
Verfasst: 30.01.2006, 17:29
von ypsie
Danke Leute, nur benutzen leider noch viele den IE.
Ein Problem gibts noch.
Code: Alles auswählen
<div id="sidebar">
<ul>
<li class="akt"><a href="#">Startseite</a></li>
<li><a href="#">Seite1</a></li>
<li><a href="#">Seite2</a></li>
<li><a href="#">Seite3</a></li>
<li><a href="#">Seite4</a></li>
<li><a href="#">Seite5</a></li>
<li><a href="#">Seite6</a></li>
</ul>
</div><!-- end.sidebar -->
div#wrap {
width: 778px;
background-image: url(logo-super.jpg);
background-repeat: no-repeat;
padding-top: 180px;
}
div#sidebar {
float: left;
width: 160px;
}
div#content {
float: right;
width: 558px;
line-height: 20px;
padding-right: 20px;
border-right: 20px solid #D2EDFA;
}
ul {
list-style: none;
width: 160px;
padding-left: 10px;
}
Der Abstand beim IE von Content und Navi ist viel zu groß.
Passt sonst alles so?
CSS Platzierung, böse Browser
Verfasst: 30.01.2006, 18:35
von Fluidum
Du sollst auch den IE nicht vergessen... Die meisten User sind damit unterwegs!
Du sollst nur beim erstellen deiner Webseite erst mit Firefox und Opera testen und dann mit dem IE, da Opera und FF die Standards besser umsetzen!
Den Code kann ich mir später ansehen, da ich gerade nicht zu hause bin...
Verfasst: 31.01.2006, 13:20
von ypsie
Vielen Dank für die Hilfen!
Wenn ihr noch was findet, bzw. das kleine Problem lösen könnt, bin ich sehr dankbar.
Sonst werd ich die Seite heute so erstellen.
lg, julian
