Du må være registrert og logget inn for å kunne legge ut innlegg på freak.no
X
LOGG INN
... eller du kan registrere deg nå
Dette nettstedet er avhengig av annonseinntekter for å holde driften og videre utvikling igang. Vi liker ikke reklame heller, men alternativene er ikke mange. Vær snill å vurder å slå av annonseblokkering, eller å abonnere på en reklamefri utgave av nettstedet.
AbonnerSkjul
Host1.no - Webhotell fra 29,-, virtuell server fra 249,-. 15% rabatt med rabattkode "nFF". Besøk oss på Host1.no!
  8 533
Kekurikekaka
Valgfri brukertittel
Kekurikekaka's Avatar
1.725 77
7. oktober 2007
Jeg har en liten feil med designet i IE 6 og 7.

Hvis du ser under på bildet, så ser du hva feilen er. Det er den fordømte streken.


Under er CSS filen, kanskje dere kan hjelpe meg å se hva som er feil.

Kode

/* Core Classes */
/*----------------------------------------------------------------------------*/

body {
	background-color: #fff;
}

body, td {
	margin: 0px;
	padding: 0px;
	text-align: left;
	color: #000;
}

body, td, .indent, .defaulttext, .caption, .captiontext, .bodytable, .mediumtext,
.forumheader, .forumheader2, .forumheader3, .forumheader4, .forumheader5, .fcaption, .finfobar {
	font: normal 11px  arial, verdana, tahoma, sans-serif;
}

.smalltext, .smallblacktext, .tbox, .button, .button:hover, .nextprev, .helpbox {
	font: normal 10px  arial, verdana, tahoma, arial, sans-serif;
}

a {
	color: #1A4487;
}

a:hover {
	color: #000;
}

img {	
	border: 0px;
}
.linkspage_button{
	border:0px;
}

form {
	margin: 0px;
}

table {
	margin-left: auto;
	margin-right: auto;
}

.tbox {
	border: #777 1px solid;
}

.indent {
	border: #999 1px dashed;
	padding: 5px;
	margin: 5px;
	background-color: #f7f7f9;
}

.button {
	border: 1px solid #A5ACB2;
	background-image : url(images/button.png);
}

.button:hover {
	background-image : url(images/buttonover.png);
}

.nextprev {
	border: 0px;
	text-align: center;
	padding: 2px;
	background-color: #f7f7f9;
}

.spacer{
	padding: 5px 0px;
}

.fborder, .border{
	border-collapse: collapse;
	border-spacing: 0px;
}

.forumheader, .forumheader2, .forumheader3, .forumheader4, .fcaption, .finfobar {
	padding: 5px;
	background-color: #fff;
	border-bottom: 1px solid #bbb;
}

.forumheader, .forumheader4, .finfobar {
	background-color: #fbfbfd;
}

.forumheader5 {
	cursor: pointer;
}

.fcaption, .forumheader5 {
	background-color: #f7f7f7;
}

.searchhighlight {
	text-decoration: underline;
	color: #ff0000;
	font-weight: bold;
}

.helpbox {
	border: 0px;
}

.news_image {
	float: right;
	padding: 0px 0px 7px 7px;
}

.logo {
	 display: block;
}
 

/* Theme Specific Classes */
/*----------------------------------------------------------------------------*/

.container {
	width: 755px;
	border-collapse: collapse;
	border-spacing: 0px;
	border-right: 1px solid #126CA3;
	border-bottom: 1px solid #126CA3;
	margin-left: 0px;
}

.top_section {
	background-image: url(images/header.jpg);
	background-repeat: no-repeat;
	background-position: top left;
}

.left_section {
	vertical-align: top;
	width: 160px;
	border-right: 1px solid #126CA3;
	background-color: #CCDCF9;
}

.top_bar {
	background-color: #126CA3;
	text-align: right;
	padding-right: 5px;
	width: 100%;
	height: 23px;
}

.main_container {
	vertical-align: top;
}

.top_inner_container {
	border-collapse: collapse;
	border-spacing: 0px;
	margin-bottom: 10px;
	width: 100%;
}

.bottom_inner_container {
	border-collapse: collapse;
	border-spacing: 0px;
	margin-bottom: 12px;
	width: 100%;
}

.right_section {
	border-left: 1px solid #126CA3;
	text-align: center;
	vertical-align: top;
	width: 160px;
}

.main_nav {
	padding-right: 5px;
	vertical-align: top;
}

.main_section {
	vertical-align: top;
	padding: 10px;
}

.main_caption, .menu_caption {
	font-weight: bold;
	color: #0B4366;
	margin-bottom: 7px;
}

.main_caption {
	font-size: 13px;
}

.tablerender {
	margin-bottom: 12px;
}

.top_left_menu_container {
	border-collapse: collapse;
	border-spacing: 0px;
	width: 100%;
}

.top_left_menu {
	background-color: #126CA3;
	font-weight: bold;
	padding: 12px 7px;
	color: #fff;
}

.top_left_menu a {
	color: #fff;
}

.top_left_menu a:hover {
	color: #ddd;
}

.top_left_menu_caption {
	font-size: 12px;
	padding-bottom: 10px;
}

.bottom_left_menu_area {
	vertical-align: top;
	padding-bottom: 10px;
}

.menu_caption {
	border-bottom: 1px solid #222;
	font-size: 12px;
}

.menu_container {
	width: 160px;
	border-collapse: collapse;
	border-spacing: 0px;
}

.menu_inner_container {
	padding: 10px 7px;
}

.disclaimer {
	text-align: center;
	width: 755px;
	padding: 12px 0px;
}


/* Theme Specific Classes: News Style */

.news_info_top {
	padding: 2px;
}

.news_info_bottom {
	width: 100%;
	background-color: #f7f7f9;
	border-collapse: collapse;
	border-spacing: 0px;
	margin-bottom: 12px;
}

.news_info_bottom_left {
	padding: 2px;
}

.news_info_bottom_middle {
	padding: 2px;
	width: 100%;
}

.news_info_bottom_right {
	padding: 2px;
	white-space: nowrap
}

.news_comments_icon {
	width: 16px;
	height: 16px;
	vertical-align: middle;
}


/* Theme Specific Classes: Cube Logo Graphic */


/* Theme Specific Classes: Advanced Content Management Graphic */

.advanced_image {
	width: 161px;
	height: 97px;
	display: block;
}


/* Theme Specific Classes: Paperclipped Notes Menu */

.paperclip_container {
	text-align: center;
	width: 160px;
	margin-left: auto;
	margin-right: auto;
}

.paperclip_inner_container {
	border-collapse: collapse;
	border-spacing: 0px;
	width: 130px;
	height: 175px;
}

.paperclip_caption {
	padding: 6px 0px;
	text-align: right;
}

.paperclip {
	font-weight: bold;
	font-size: 12px;
	padding: 34px 20px 0px 20px;
	text-align: left;
	background-image: url(images/paperclip.png);
	background-repeat: no-repeat;
	background-position: top center;
	margin-bottom: 5px;
	vertical-align: top;
}


/* Theme Specific Classes: Post It Note Menu */

.post_it_container {
	text-align: center;
	margin-bottom: 9px;
	margin-top: 7px;
	width: 160px;
	margin-left: auto;
	margin-right: auto;
	font-weight: bold;
	font-size: 12px;
}

.post_it_top {
	background-image: url(images/post_it_top.png);
	background-repeat: no-repeat;
	background-position: top center;
}

.post_it_back {
	text-align: left;
	background-image: url(images/post_it_middle.png);
	background-repeat: repeat-y;
	background-position: center;
	width: 120px;
	margin-left: auto;
	margin-right: auto;
}

.post_it_bottom {
	background-image: url(images/post_it_bottom.png);
	background-repeat: no-repeat;
	background-position: bottom center;
	padding: 12px 7px;
}

.post_it_caption {
	padding-bottom: 5px;
}


/* Brainjar Nav Menu Classes {SITELINS_ALT} */
/*
If you do not use {SITELINS_ALT} and switch to the standard {SITELINKS} instead, 
all of the below can be deleted.
*/
/*----------------------------------------------------------------------------*/

div.menuBar, div.menuBar a.menuButton, div.menuButton, div.menuButton_over, div.menu, div.menu a.menuItem {
	font: bold 12px arial, verdana, arial, tahoma, sans-serif;
	color: #126CA3;
	text-align: left;
}

div.menuBar {
	background-color: #fff;
	border-top: 1px solid #fff;
	padding: 4px 0px;
	text-align: right;
}

div.emenuBar {
	background-color: #F7F9FA;
	border-top: 1px solid #fff;
	text-align: left;
}

div.menuBar a.menuButton, div.menuButton, div.menuButton_over {
	background-color: transparent;
	border: 1px solid;
	border-color: transparent !important;
	border-color: #fff #fff #fff #fff;
	left: 0px;
	margin: 0px;
	padding: 2px 6px 2px 6px;
	position: relative;
	text-decoration: none;
	top: 0px;
	z-index: 100;
}

div.menuBar a.menuButton:hover, div.menuButton:hover, div.menuButton_over {
	background-color: #126CA3;
	border-color: #fff #fff #fff #fff !important;
	color: #fff;
}

div.menuBar a.menuButtonActive, div.menuButtonActive, div.menuButtonActive:hover, div.menuBar a.menuButtonActive:hover {
	background-color: #126CA3;
	border-color: #fff #fff #fff #fff !important;
	left: 1px;
	top: 1px;
	color: #fff;
}

div.menu {
	background-color: #FCFDFF;
	border: 1px solid;
	border-color: #fff #a5a5a5 #a5a5a5 #fff;
	left: 0px;
	padding: 1px;
	position: absolute;
	top: 0px;
	visibility: hidden;
	z-index: 101;
}

div.menu a.menuItem {
	display: block;
	padding: 2px 11px 2px 0px;
	text-decoration: none;
	white-space: nowrap;
}

div.menu a.menuItem:hover, div.menu a.menuItemHighlight {
	background-color: #F2F4FF;
}

div.menu a.menuItem span.menuItemBuffer, div.menu a.menuItem:hover span.menuItemBuffer {
	padding: 0px 2px;
}

div.menu a.menuItem span.menuItemText {
	padding: 0px 0px 0px 3px;
}

div.menu a.menuItem span.menuItemArrow {
	margin-right: -.75em;
}

div.menu div.menuItemSep {
	border-top: 1px solid #a5a5a5;
	border-bottom: 1px solid #fff;
	margin: 4px 2px;
}

a.menuItem.header {
	border-bottom: 1px solid #b3b3b3;
}
EDIT:
Jeg mistenker at det har noe med at http://kuleste.net/bilder/advanced.png er en px for lang i bredde, noe som har følger for resten av menyen nedover.

Men hvis jeg tar den en px kortere, så får jeg en px med tomrom imellom headeren og det bilde.
har heller ingen anelse om hvordan jeg kan få headeren til å erstatte advanced.php og headeren, så det blir til ett. Dette er sikkert noe jeg må gjøre i PHP filen.

Jeg klarer sikkert å gjøre det selv, men vil ikke endre for mye der, så hvis jeg bare finner en liten fix til dette problemet.


Men hvorfor er det sånn forskjell? Viser IE bilder en px kortere/lengere eller noe ?
Sist endret av Kekurikekaka; 7. oktober 2007 kl. 16:56.
fuzzy76
webdings
fuzzy76's Avatar
2.482 589
7. oktober 2007
Nei, feilen skyldes nok at IE går i quirks mode fordi den finner data før doctypen (det liker den ikke).

Fjern ALT før doctype-taggen slik at doctype-taggen begynner først på den første linja i dokumentet.

I tillegg er sida di full av valideringsfeil, det kan også forårsake forskjellig tolkning fra en nettleser til en annen siden de blir nødt til å gjette seg frem til hva du egentlig mener.
Kekurikekaka
Valgfri brukertittel
Kekurikekaka's Avatar
Trådstarter
1.725 77
7. oktober 2007
Skal se på det.

Jeg fant 17 feil med xhtml.

Ved å fjerne youtube filmen og en <br> tag, så var alle de borte bortsett fra 1.
Ingen feil med CSS filen heller.

Jeg finner forresten ikke noe som heter doctype i PHP filen eller CSS filen.
Ser at det er den siste feilen, men vet ikke nøyaktig hva jeg skal fjerne.
Sist endret av Kekurikekaka; 7. oktober 2007 kl. 18:52.
fuzzy76
webdings
fuzzy76's Avatar
2.482 589
7. oktober 2007
Når det gjelder å feilsøke HTML og layout er PHP-filen lettere ubrukelig. Åpne siden i en nettleser og velg "view source" så ser du hva jeg snakker om. Hvilken fil på serveren som genererer den outputen kan jeg naturlig nok ikke uttale meg om.
Kekurikekaka
Valgfri brukertittel
Kekurikekaka's Avatar
Trådstarter
1.725 77
7. oktober 2007
Så det du sier, er at alt jeg må fjerne er:
<?xml version='1.0' encoding='utf-8' ?>
?
Deezire
Tastaturkriger
Deezire's Avatar
5.280 2.050
7. oktober 2007
Ja - ingenting i ditt dokument har noe som helst med XML 1.0 å gjøre, så hvorfor skal du forvirre nettleseren ved å definere det før doctype? Gjør som fuzzy76 sier, han er en særdeles vis mann innenfor HTML og CSS.
Kekurikekaka
Valgfri brukertittel
Kekurikekaka's Avatar
Trådstarter
1.725 77
7. oktober 2007
Hmm. Dette har vel heller ikke noe med designet å gjøre heller?

Men vil dette hjelpe for den streken? Eller er det bare noe dere anbefaler meg å gjøre?
vidarlo
Trigonoceps occipita
vidarlo's Avatar
Donor
27.682 31.078
7. oktober 2007
Sitat av Sceptic
Hmm. Dette har vel heller ikke noe med designet å gjøre heller?

Men vil dette hjelpe for den streken? Eller er det bare noe dere anbefaler meg å gjøre?
Vis hele sitatet...
Første steg når du har problemer med HTML er å få det til å validere. Alltid. Når det validerer, og ting fortsatt er feil, så kan du begynne å sjå på bugs i ulike browsere o.l.

Derfor sørger du for at det første du gjer er å validere dritten.
fuzzy76
webdings
fuzzy76's Avatar
2.482 589
7. oktober 2007
Dette kan (nesten garantert) hjelpe for streken ja. Quirks mode påvirker hvordan Internet Explorer tegner opp siden din. Det som skjer er at Internet Explorer i bunn og grunn prøver å emulere Netscape 4 fra 90-tallet fordi den tror siden din er skrevet for den.

For utfyllende forklaring kan du lese http://www.quirksmode.org/css/quirksmode.html

Jeg vil gi deg plusspoeng for at du fiksa valideringsproblemene i tillegg så jeg slapp å referere deg til http://hp.fuzzy76.net/archives/154-H...elper-deg.html