✔ und sehen gleich aus, wieso?

gerd01 · 27. März 2007

Hallo,

ich habe ein Problem mit dem -tag in meiner seite, zumindest ist das meine Vermutung:

ich setze Texte so in html ein:

Code:

<p>blabla</p>

oder

Code:

<p>blabla</br>blaub</p>

Hier geht´s zur Seite

Bei der Darstellung gibt es jedoch keinen Unterschied, ob nur ein Umbruch vorhanden ist, oder ein Absatz, kann da vielleicht jemand einen Fehler ausmachen?

info: html und css sind valide, getestet bei w3.org!

Danke im voraus!

ciao Gerd

PS:

Mein komplettes Stylesheet sieht so aus:

Code:

*
{
	padding:0px;
	margin:0px;
}
html
{
	height: 100%;
	background: url(back.gif) left top  repeat-x #c0c0c0;
}
body
{
	font: 12px Arial, Helvetica, sans-serif;
	height: 100%;
	text-align:center;
	width:760px;
	margin:auto;  
	
}
#nonFooter
{
	width:760px;
	position: relative;
	min-height: 100%;
	background-color:#fff;
}
* html #nonFooter
{
	height: 100%;
}
#footer
{
	width:730px;
	height:32px;
	position: relative;
	margin: -42px 20px 0px 10px;
	background-color:#7e0e0e;
	padding-left:10px;
	line-height:32px;
	text-align: left;
	color:#fff;
}
/* A CSS hack that only applies to IE -- specifies a different height for the footer */
* html #footer
{
	margin: -42px 10px 0px 10px;
	width:740px;
}
#page
{
	text-align: left;
	padding:10px;
}
#top
{
	clear: left;
	height:50px;
	padding-bottom:10px;	
}
#logon
{
	color:#000;
	text-align: right;
	padding: 10px 0px 10px 0px;
	height:50px;
	
}
#logo
{
	height:50px;
	width:195px;
	float:left;	
}
#topnavi
{	
	text-align: left;
	padding-bottom:10px;
}
#mainnavi
{
	background-color:#7e0e0e;
	height:32px;
	font-size: 18px;
	color:#fff;
	border-top:1px solid #fff;
	
}
#mainnavi ul li
{
	float:left;
	list-style: none;
	text-align: center;
	width:148px;
	line-height: 32px;
}
#mainnavi ul li a
{
	display:block;
	width:100%;
	color:#fff;
	text-decoration: none;
	background-color: #7e0e0e;
}
#mainnavi ul li a:hover
{
	color:#7e0e0e;
	text-decoration: none;
	background-color: #ccc;
}


* #mainnavi
{
	margin-top:-3px;
}
#pic
{
	height:220px;
	border-bottom:1px solid #fff;
	overflow:hidden;
}
#main
{
	clear:both;
	padding-top:10px;
}
#column
{
	float:left;
	width:180px;
	overflow:hidden;
}

#content
{
	padding-left:10px;
	float:right;
	width:550px;
	padding-bottom:24px;
	line-height: normal;
}
* html #content
{
	float:none;
}

#clear
{
	height:40px;	
	clear: both;
}

.w3c
{
	padding-top:10px;
	padding-left:10px;
	float:right;
	height:40px;
}
#subnavi
{
	line-height: 20px;
}
#subnavi ul
{
	list-style: none;
}
.title
{
	padding-left:5px;
	padding-right:5px;
	font-size: 18px;
	width: 100%;
	border-bottom: 1px solid #e0e0e0;
	font-weight: bold;
	padding-bottom:5px;
}
#subnavi
{
	padding-bottom:30px;
}
#subnavi ul li a
{
	padding-left: 5px;
	padding-right: 5px;
	color: #000;
	display: block;
	width: 100%;
	text-decoration: none;
	border-bottom: 1px solid #e0e0e0;
	font-weight: normal;
}
#subnavi ul li a:hover
{
	padding-left:5px;
	padding-right:5px;
	color:#000;
	display: block;
	width: 100%;
	text-decoration: none;
	border-bottom: 1px solid #e0e0e0;
	font-weight: bold;
}
#subnavi ul li a.current
{
	font-weight: bold;	
}
#subnavi ul li ul li a
{
	padding-left:5px;
	padding-right:5px;
	color:#000;
	display: block;
	width: 100%;
	text-decoration: none;
	border-bottom: 1px solid #e0e0e0;
	border-left:10px solid #7e0e0e;
	font-weight: normal;
}
#subnavi ul li ul li a:hover
{
	padding-left:5px;
	padding-right:5px;
	color:#000;
	display: block;
	width: 100%;
	text-decoration: none;
	border-bottom: 1px solid #e0e0e0;
	border-left:10px solid gray;
	font-weight: bold;
}
* html #subnavi ul li ul li a,* html  #subnavi ul li ul li a:hover
{
	width: 100%;
}
#headline
{

	font-size: 22px;
	font-weight: bold;
}
.block
{
	width:100%;
	padding-bottom: 30px;
}
.blockcontent
{
	padding: 0px 5px 0px 5px;
}
.blockcontent p
{
	line-height: 16px;
}
#logon a.toplink
{
	display: inline-table;
	width:70px;
	color:#000;
	text-align: center;
	text-decoration: none;
	font-weight: normal;
}
#logon a.toplink:hover
{
	display: inline-table;
	width:70px;
	color:#000;
	font-weight: bold;
	text-decoration: none;
}

#mainnavi ul li a.current
{
	background-color: #fff;
	color:#7e0e0e;
}
#topnavi a.breadcrumb
{
	color:#444;
	text-decoration: none;
	border:0px;
}

#topnavi a.breadcrumb:hover
{
	color:#444;
	text-decoration: none;
	border-bottom: 1px dotted #444;
}
/*
-------------------------------SITEMAP
*/
#sitemap
{
}
#sitemap .langsitemap
{
	width:100%;
	float:right;
	font-size: 13px;
	font-weight: bold;
	color:#0F13C1;
}

.sitemaplevel1 li
{
	font-size: 12px;
	font-weight: normal;
	list-style: none;
	line-height: 24px;
}
a.level1
{
	color:#000;
	text-decoration: none;
	font-weight: bold;
}
a.level1:hover
{
	color:#999;
}
.sitemaplevel2 li
{
	font-weight: normal;
	font-size: 12px;
	list-style: none;
	line-height: 24px;
	
}
a.level2
{
	color:#000;
	text-decoration: none;
	font-weight: lighter;	
}
a.level2:hover
{
	color:#999;
}
/*
-------------------------------FORM
*/
form.formation *
{	
	font-size:100.01%;
	margin:0;
	padding:0;
	color:black;
	background-color:white;
	font-family:Verdana,Sans-serif;
}

form.formation fieldset
{	
	border:1px solid #CCC;
	margin:2em;
	padding:1em;
	font-size:0.9em;font-weight:700;
	width:25em;
}

form.formation  p.radio,
form.formation p.checkbox
{	
	font-size:0.9em;
}

/* really bad IE hack \*/
* html form.formation fieldset { width:29em; }
* html form.formation fieldset legend { margin-bottom:1em; }
/* IE hack */

form.formation label
{	
	font-size:0.8em;
	font-weight:700;
	width:10em;
	float:left;
	margin:0 0 0.3em 0;
}

form.formation input, 
form.formation select, 
form.formation textarea
{	
	font-weight:normal;
	float:left;
	margin:0 0 0.3em 0;
	font-size:0.8em;
}

form.formation fieldset br
{	
	clear:left;
}

form.formation input.text,
form.formation input.password
{	
	width:20em;
	border:1px solid #CCC;
	padding:0.1em;
}

form.formation select
{	
	width:20.3em;
	border:1px solid #CCC;
}

form.formation textarea
{	
	width:20em;
	border:1px solid #CCC;
	padding:0.1em;
}

form.formation input.checkbox
{	
	margin-left:8em;
}

form.formation label.checkbox
{	
	font-weight:normal;
	margin-left:1em;
}
form.formation input.radio
{	
	margin-left:8em;
}

form.formation label.radio
{	
	font-weight:normal;			
	margin-left:1em;
}
form.formation input.button
{	
	width:30.3em;
	border:1px solid #CCC;
	background-color:#DDD;
	font-weight:700;
	font-size:0.8em;
	margin-top:2em;
	color:black;
}

form.formation input.button:hover
{	
	border:1px solid black;
}

form.formation p.FORMATIONerror
{	
	border:1px solid #7E0E0E;
	color:#fff;
	background-color:#c04040;
	padding:5px;
	margin:0 20px 20px 20px;
	font-size:1em;
	text-align:center;
}

form.formation p.FORMATIONsuccess
{	
	border:1px solid #0E7E0E;
	color:#fff;
	background-color:#40c040;
	padding:5px;
	margin:0 20px 20px 20px;
	font-size:1em;
	text-align:center;
}
form.formation strong
{
	background:none;
}

Maik · 27. März 2007

Hi,

ich tippe mal auf die Regel mit dem Universal-Selektor *, die u.a. auch für das p-Element gilt, sodass der Abstand zwischen den einzelnen Textabsätzen null ist:

Code:

*
{
	padding:0px;
	margin:0px;
}

gerd01 · 27. März 2007

danke,

ich liebe dich dafür, genau das war es!

wie blöd von mir, natürlich!

ciao und gruß gerd

Julian Maicher · 27. März 2007

Und gibt es nicht. Wenn dann .

gerd01 · 27. März 2007

jau, klaro, war zu schnell von mir, natürlich benutze ich auch nur das: 

ciao gerd

✔ <p> und <br> sehen gleich aus, wieso?

gerd01

Grünschnabel

Maik

gerd01

Grünschnabel

Julian Maicher

Erfahrenes Mitglied

gerd01

Grünschnabel

Neue Beiträge