zurück zur Startseite
  


Zurück XHTMLforum > (X)HTML und CSS > CSS
Seite neu laden border um box

Antwort
 
LinkBack Themen-Optionen Ansicht
  #1 (permalink)  
Alt 09.05.2005, 12:06
Benutzer
neuer user
Thread-Ersteller
 
Registriert seit: 05.04.2005
Beiträge: 51
eyetag befindet sich auf einem aufstrebenden Ast
Standard border um box

hallo,

habe in meinen sidebar ein element 'box' eingeführt.
daraus würd`ich jetzt auch gerne eine box machen, kriege diese aber nicht hin: border und background werden nicht angezeigt...

was mache ich da falsch?

danke!!!
et

URL

Code:
<div id=box>

	[*]

	<h3>Aktuelle Erkenntnis</h3>
	<?php witty('"','"
'); ?>
	

</div>
style
Code:
#sidebar {
	background: transparent;
	border: none;
	color: #443;
	float: right;
	font-size: 11px;
	margin: 0;
	padding: 0 27px 30px 0px;
	text-align: left;
	width: 128px;
}

#sidebar a {
	color: #444433;
}

#sidebar a:hover {
	color: #ff0064;
}

#sidebar h2 {
	color: #ff0064;
	font-size: 11px;
	font-weight: normal;
	letter-spacing: 0.3em;
	margin: 20px 0 10px 0;
	padding: 0;
}

#sidebar h3 {
	color: #ff0064;
	font-size: 11px;
	font-weight: bold;
	letter-spacing: 0.3em;
	margin: 20px 0 10px 0;
	padding: 0;
}

#sidebar li {
	line-height: 1.5em;
	list-style-type: none;
	margin: 0;
	padding: 0;
}

#sidebar ul {
	list-style-type: none;
	margin: 0 0 0 10px;
	padding: 0;
}

#sidebar box li {
	background: #fff;
	margin: 0;
	padding: 0;
	border: 1px solid #000;

}
[/url]
Mit Zitat antworten
Sponsored Links
  #2 (permalink)  
Alt 09.05.2005, 12:10
Erfahrener Benutzer
XHTMLforum-Mitglied
 
Registriert seit: 28.11.2004
Beiträge: 547
lomtas befindet sich auf einem aufstrebenden Ast
Standard

die id=box würde ich in anführungsstriche setzen also id="box"

und dann sollte man die nicht mit box ansprechen sondern mit #box
also

#sidebar #box li{}
Mit Zitat antworten
Sponsored Links
  #3 (permalink)  
Alt 09.05.2005, 12:27
Benutzer
neuer user
Thread-Ersteller
 
Registriert seit: 05.04.2005
Beiträge: 51
eyetag befindet sich auf einem aufstrebenden Ast
Standard


jetzt bräucht ich noch folgendes:
- abstand zur box gleich wie zwischen den anderen[*] elementen
- abgerundete linie (am besten mit weicher kante, geht das..?)
- abstand zwischen box überschrift box und text kleiner

komplette style.css

danke nochmal...
Mit Zitat antworten
  #4 (permalink)  
Alt 09.05.2005, 12:42
Erfahrener Benutzer
XHTMLforum-Kenner
 
Registriert seit: 11.01.2005
Ort: Berlin
Beiträge: 2.149
mazzo wird schon bald berühmt werden
Standard

Zu den abgrundeten Ecken hier ein paar Links (erst mit CSS3 sind "runde Ecken" vorgesehen, wenn die Browser so schnell darauf reagieren wie auf CSS2 kann man schon in ca. 10 Jahren damit arbeiten...):

http://www.alistapart.com/articles/customcorners/
und ohne Grafiken:
http://www.stunicholls.myby.co.uk/boxes/curves.html
Mit Zitat antworten
  #5 (permalink)  
Alt 09.05.2005, 13:43
Benutzer
neuer user
Thread-Ersteller
 
Registriert seit: 05.04.2005
Beiträge: 51
eyetag befindet sich auf einem aufstrebenden Ast
Standard

nett, ist mir aber zuviel code im moment, außerdem scheinbar nicht gut für text-darstellung...
so wie ichs jetzt hab (in FF) passt mir eigentlich ganz gut, nur dem IE wohl nicht ...
was kann man da machen?
Mit Zitat antworten
  #6 (permalink)  
Alt 10.05.2005, 10:21
Benutzer
neuer user
Thread-Ersteller
 
Registriert seit: 05.04.2005
Beiträge: 51
eyetag befindet sich auf einem aufstrebenden Ast
Standard

hallo!? noch irgendwer da?
Mit Zitat antworten
  #7 (permalink)  
Alt 10.05.2005, 10:28
Erfahrener Benutzer
XHTMLforum-Kenner
 
Registriert seit: 11.01.2005
Ort: Berlin
Beiträge: 2.149
mazzo wird schon bald berühmt werden
Standard

hab mal eben validiert: http://validator.w3.org/check?verbos...tag.de/weblog/

vielleicht erstmal aufräumen (doppelt vergebene ID) und dann mal gucken wie es weitergeht.
Bei schnellansicht konnte ich den CSS für die Klasse "aligncenter" nciht finden. Vielleicht kannst Du hier eine Forums-angepasste codierung bereitstellen, so dass das Problem auf das Wesentliche reduziert ist.
Mit Zitat antworten
  #8 (permalink)  
Alt 10.05.2005, 11:56
Benutzer
neuer user
Thread-Ersteller
 
Registriert seit: 05.04.2005
Beiträge: 51
eyetag befindet sich auf einem aufstrebenden Ast
Standard

jaja, die validierung, ich weiß siehe dazu auch http://www.xhtmlforum.de/viewtopic.php?t=4113#26997

um die entfernung der doppelten id gehts da auch gerade noch.

den entsprechenden code für die box im sidebar hatte ich eigentlich schon geposted hier - das sollte eigentlich so klar sein... oder was brauchst du noch?
Mit Zitat antworten
  #9 (permalink)  
Alt 10.05.2005, 16:03
Erfahrener Benutzer
XHTMLforum-Kenner
 
Registriert seit: 11.01.2005
Ort: Berlin
Beiträge: 2.149
mazzo wird schon bald berühmt werden
Standard

für die sidebar steht der CSS Code oben, aber das hier ist der Quellcode Deines Links für den Bereich, der im IE ohne Hintergrund gezeigt wird:

Code:
<div class="aligncenter">

	<ul>

	<li class="page_item">impressum

<li class="page_item">kontakt

<li class="page_item">links


<li class="page_item">saq's



	[/list]
</div>
und die Klasse "aligncenter" dazu hab ich nicht gefunden. Daher die Bitte eine runtergedampfte Dummyseite auf der das problem weiter besteht hier in direkt zu posten, dann muss man sich nciht durch den ganzen Code online wühlen.
Mit Zitat antworten
Sponsored Links
  #10 (permalink)  
Alt 10.05.2005, 18:40
Benutzer
neuer user
Thread-Ersteller
 
Registriert seit: 05.04.2005
Beiträge: 51
eyetag befindet sich auf einem aufstrebenden Ast
Standard

Code:
#footer {
	background: transparent url(images/bottom.gif) no-repeat bottom center;
	clear: both;
	color: #808979;
	font-size: 11px;
	height: 75px;
	margin: 0;
	padding: 10px 10px 10px 67px;
}

#footer ul{
	padding : 0;
	margin: 0px 0px 5px 0px;
	text-align: center;
	white-space : nowrap;
}

#footer ul li{
display : inline;
}

#footer ul li a{
   display : inline;
   color: #000;
   font-weight: normal;
   padding-left: 2px;
   padding-right: 2px;
}

#footer a {
	color: #000;
	}
	
#footer ul li a:hover {
	text-decoration: underline;
	}

#rechte {
	width:175px; 
	float:right; 
	text-align:center;

}

[...] 

.alignleft {
	float: left;
	text-align: left;
}

.alignright {
	float: right;
	margin-top: -1px;
	text-align: right;
}

.aligncenter {
	float: center;
	text-align: center;
	width: 460px;
}
reicht dir das? hab' ich einfach aus dem style.css entnommen...
ich glaube das sind alle relevanten teile.

der vollständigkeit halber nochmal die html source, etwas bereinigt:
Code:
<div id="footer">

<div id="rechte">


[img]http://creativecommons.org/images/public/somerights20.gif[/img]




[img]http://www.shesaiddestroy.org/keine-zielgruppe/keinezielgruppe.gif[/img]




</div>

<div class="aligncenter">

	<ul>

	<li class="page_item">impressum

<li class="page_item">kontakt

<li class="page_item">links

<li class="page_item">saq's




	[/list]
</div>

<div class="aligncenter">

	eyetag’s weblog project is proudly powered by 
			WordPress
			
Entries (RSS)

			and Comments (RSS).
			26 queries. 1.864 seconds.
	

</div>

</div>
Mit Zitat antworten
Sponsored Links
Antwort

Themen-Optionen
Ansicht

Forumregeln
Es ist Ihnen nicht erlaubt, neue Themen zu verfassen.
Es ist Ihnen nicht erlaubt, auf Beiträge zu antworten.
Es ist Ihnen nicht erlaubt, Anhänge hochzuladen.
Es ist Ihnen nicht erlaubt, Ihre Beiträge zu bearbeiten.

BB-Code ist an.
Smileys sind an.
[IMG] Code ist an.
HTML-Code ist aus.
Trackbacks are an
Pingbacks are an
Refbacks are aus


Ähnliche Themen
Thema Autor Forum Antworten Letzter Beitrag
Verschiebungen bei größerem Bildschirm seelefant CSS 4 28.07.2014 16:43
Navigation positionieren maybebabe CSS 4 08.04.2013 23:17
Dynamische Größen Killhunter CSS 0 14.05.2011 17:56
ps design (slices), php (dynamischer inhalt), css gestaltung schleepy CSS 19 02.06.2006 23:46
#boxes a:hover.info: 2.posting mit css !!! marioN CSS 5 25.01.2004 18:04


Alle Zeitangaben in WEZ +2. Es ist jetzt 07:13 Uhr.