div in safari

[parisdiesel]

Hallo, als ik in ie mijn pagina opvraag word tie goed weergegeven, maar in safari of google klopt er niets meer van.

 body{
margin: 0;
text-align: center;
}

div#main_container{
margin-top: 20px;
background-image:url('from.jpg');
width: 800px;
height: 1000px;
text-align: left;
}

.links {
font-family: "Trebuchet MS", verdana, arial, helvetica, sans-serif; font-color: #ffffff;
font-weight: bold;
font-size: 90%;
padding: 60px 50px 10px 20px;
background-image:url('verjaardag.jpg');
backround-repeat: no-repeat; 
margin-top: 0px;
float: left;
width: 350px;
height: 300px;
}

.rechts {
background-image:url('Gefeliciteerd.jpg')
backround-repeat: no-repeat; ;
padding: 10px 20px 10px 20px;
margin-top: 0px;
float: right;
width: 445px;
height: 300px;
}

 

[Frats]

Hij lijkt het alleen te doen in IE, dus ik denk niet dat het probleem hem zit in alle andere browsers

Misschien eens kijken of je het standards-compliant kan krijgen?

 

[Tha Devil]

Punt 1: Waar is het PHP in deze vraag?
Punt 2: Waarom heb je de code die hier staat niet online ook in gebruik?

Aangezien er redelijk wat stukken anders zijn lijkt me dat wel zo handig willen wij je kunnen helpen

Verplaatst naar CSS

 

[parisdiesel]

Sorry, heb de code al tig keer aangepast wil maar niet werken.
hier de code zoals tie nu is.
Ps, als ik dit weg haal padding: 60px 50px 10px 20px; doet tie het wel goed in safari, maarja dan loopt de tekst door elkaar van de afbeelding en label.

body{
margin: 0;
text-align: center;
}
div#main_container{
margin-top: 20px;
background-image:url('from.jpg');
width: 900px;
height: 1000px;
text-align: left;
}

.links {
background-image:url('verjaardag.jpg');
backround-repeat: no-repeat; 
margin-top: 0px;
float: left;
width: 350px;
height: 300px;
padding: 60px 50px 10px 20px;
}

.rechts {
background-image:url('Gefeliciteerd.jpg');
backround-repeat: no-repeat; 
margin-top: 0px;
float: right;
width: 445px;
height: 300px;
}

 

[Tha Devil]

Probeer dit eens:

body{
margin: 0;
text-align: center;
}
div#main_container{
margin-top: 20px;
background:url('from.jpg') repeat-x;
width: 900px;
height: 1000px;
text-align: left;
}

.links {
background:url('verjaardag.jpg') no-repeat;
float: left;
width: 350px;
height: 300px;
padding: 60px 50px 10px 20px;
}

.rechts {
background:url('Gefeliciteerd.jpg') no-repeat;
float: right;
width: 445px;
height: 300px;
}

Zorgt in ieder geval voor een goede weergave in FF

 

[parisdiesel]

Dit werkt Tha Devil, dankje. Als ik nu ook nog de body gecentreerd krijg is mijn probleem volledig opgelost. In ie word alles wel goed gecentreerd, maar in safari en google niet.

 

[Tha Devil]

body{
margin: 0 auto;
text-align: center;
}

Meende ik.

 

[peter vazed]

div#main_container{
margin-top: 20px;
background-image:url('from.jpg');
width: 900px;
height: 1000px;
text-align: left;
margin-left:auto;
margin-right:auto;
}

 

[parisdiesel]

Bedankt jongens, het werkt nu goed, als ik jullie niet had!:thumb: