Validerings problem på .css

14 svar · 429 visningar · startad av Nova 13 dec. 2005

NovaMedlem sedan feb. 2005216 inlägg

Frågan13 dec. 2005 07:58#1

Denna kod

/*hogerspalt*/
#navBar
{
min-height:756px;
 -height:756px;
  float: right;
	width: 18%;	
		margin: 1px;
	padding: 1px;
	background-color: #eeeeee;
	border-left: 1px solid #cccccc;
	border-bottom: 1px solid #cccccc;
	border-right: 1px solid #cccccc;
	} 
	
/*********** Hogerspalt uppe styles ***********/

.relatedLinks{
	margin: 1px;
		padding: 2px 2px 2px 2px;
	font-size: 84%;
	}

Ger detta felmedelande när jag validerar

Line: 191

Parse Error - : right; width: 18%; margin: 1px; padding: 1px; background-color: #eeeeee; border-left: 1px solid #cccccc; border-bottom: 1px solid #cccccc; border-right: 1px solid #cccccc; } .relatedLinks

silfverMedlem sedan apr. 200312 679 inlägg

13 dec. 2005 08:02#2

Denna raden är fel:

-height: 756px;

Bort med minus-tecknet.

NovaMedlem sedan feb. 2005216 inlägg

13 dec. 2005 08:09#3

Jag använder -height: 756px; för att annars trycks texten igenom botten i firefox. Finns det något annat "hack" som löser detta problem då
http://www.webforum.nu/showthread.php?t=135887

TroxyMedlem sedan mars 20041 505 inlägg

13 dec. 2005 08:10#4

Att ange både height och min-height kommer göra att height endast används.
Antagligen är -height ett IE-hack i försök att dölja det från andra webbläsare.

silfverMedlem sedan apr. 200312 679 inlägg

13 dec. 2005 08:20#5

Om du gör så här då? Tar bort raden -height från din css. Lägger in den här mellan <head> i stället:

<!--[if IE]>
	<style type="text/css">
		#navBar {
			-height: 756px;
		}
	</style>
<![endif]-->

TroxyMedlem sedan mars 20041 505 inlägg

13 dec. 2005 08:31#6

Ser bra ut, men minus-tecknet är väl inte nödvändigt i sånna fall ;)

silfverMedlem sedan apr. 200312 679 inlägg

13 dec. 2005 08:35#7

Troxy skrev:

Ser bra ut, men minus-tecknet är väl inte nödvändigt i sånna fall ;)

Tanken var att slippa ha minus-tecknet i css-koden (så den validerar) och bara köra den kodsnutten när någon surfar in med IE. Det borde väl vara korrekt? Eller tänker jag fel nu igen? :OO :p

NovaMedlem sedan feb. 2005216 inlägg

13 dec. 2005 09:06#8

Jag flyttade de ahck jag har till

<!--[if IE]>
	<style type="text/css">
		#navBar {
			height: 756px;
		}
		#headlines {
			height: 756px;
		}
		#wrapper {
			width: 850px;
		}
	</style>
<![endif]-->

Så nu validerar sidan för .css

Tackar :)

silfverMedlem sedan apr. 200312 679 inlägg

13 dec. 2005 09:14#9

Bra! :bire

tantenMedlem sedan nov. 20051 596 inlägg

13 dec. 2005 09:38#10

Jag har tidigare varit runt och gottat mig i dina recept...
Jag tror du kommer få ständiga problem med detta att ange en bestämd höjd. På en del sidor är innehållet mindre än 756px, med långa tomma slut på kolumnerna. På andra sidor är mittenkolumnen högre än 756px. Så fort någon av kolumnerna blir högre än 756px så kommer texten att bryta igenom igen och du får ändra höjden igen, vilket då kan bli lite konstigt på sidorna med litet innehåll.
Så aktiv som du verkar vara med att fylla på grejer i dina kolumner, så skulle du nog fundera på att ha en bakrundsbild i stället. En som täcker hela bakgrunden under de tre kolumnerna med grått på varje sida och vitt i mitten.
Den behöver bara vara 1px hög. Bara ett tips...
God Jul!

NovaMedlem sedan feb. 2005216 inlägg

13 dec. 2005 21:38#11

tanten skrev:

så skulle du nog fundera på att ha en bakrundsbild i stället. En som täcker hela bakgrunden under de tre kolumnerna med grått på varje sida och vitt i mitten.
Den behöver bara vara 1px hög. Bara ett tips...
God Jul!

Kan du förklara lite närmare hur/vad?

m_soderlundMedlem sedan sep. 20026 425 inlägg

13 dec. 2005 22:00#12

http://www.alistapart.com/articles/fauxcolumns/ :)

NovaMedlem sedan feb. 2005216 inlägg

14 dec. 2005 09:00#13

m_soderlund skrev:

http://www.alistapart.com/articles/fauxcolumns/ :)

Det blev denna lösning till sist.

 background-image: url(bakgrund.gif);
	background-repeat: #ccc repeat-y 50% 40;

zcorpanMedlem sedan dec. 20042 245 inlägg

14 dec. 2005 09:22#14

Nova skrev:

Det blev denna lösning till sist.
 background-image: url(bakgrund.gif);
	background-repeat: #ccc repeat-y 50% 40;

Det borde nog antingen vara

background:#ccc url(background.gif) repeat-y 50% 40px;

eller

background-color:#ccc;
background-image:url(background.gif);
background-repeat:repeat-y;
background-position:50% 40px;

(om du nu tänkte ha px?)

NovaMedlem sedan feb. 2005216 inlägg

15 dec. 2005 06:21#15

zcorpan skrev:

Det borde nog antingen vara

background:#ccc url(background.gif) repeat-y 50% 40px;

eller

background-color:#ccc;
background-image:url(background.gif);
background-repeat:repeat-y;
background-position:50% 40px;

(om du nu tänkte ha px?)

Rätt!

Men det fungerade som jag ville fast jag hade grötat till det.