 |
|
|
Zoeken • Gebruikerslijst • Gebruikersgroepen
• Registreer
• Profiel • Log in om je privé berichten te bekijken
• Ben je al lid? Log in!
|
|
|
|
|
Sponsors:
Relaties:
|
|
Nieuw onderwerpNieuw antwoord
| ngeersing |
 Geplaatst op 19-11-2008 |
 |
Senior lid
|
Tijd niet geweest op het forum, maar heb weer een vraag:
Ben bezig met een website voor t bedrijf waar ik werk. Nou heb ik met html en css een leuke site inelkaar geflanst maar zit ik weer eens met de browserverschillen.
In IE wordt mijn " tekstvak"(om het zo maar even te noemen) goed weergegeven maar in Firefox wordt hij veel te hoog geplaatst en komt hij achter mijn 3 infoboxen. Ook al met margins lopen kloten maar mocht tot dusver niet baten.
Ik hoop dat iemand van jullie mij hiermee kan helpen. Alvast bedankt!
De website waar het om gaat: http://www.joymode.nl/v2
Hier even het css document
| Code: | @charset "utf-8";
/* CSS Document */
body{background-image:url(../images/winter2.jpg);
background-repeat:no-repeat;
background-position:right;
background-color:#000000;
}
div#content{
background-image:url(../images/trans.png);
background-repeat:repeat-y;
margin:0 auto;
width:750px;
height:876px;
}
div#header {
background-image:url(../images/header.png);
background-repeat:no-repeat;
background-position:center;
height:220px;
width:720px;
margin:auto;
margin-top:20px;
}
div#box1 {
height:165px;
width:230px;
float:left;
margin-left:20px;
}
div#box2 {
height:165px;
width:230px;
float:left;
margin-left:10px;
}
div#box3 {
height:165px;
width:230px;
float:left;
margin-left:10px;
}
ul#menu{
margin:0 auto;
padding:0;
list-style-type:none;
width:700px;
position:relative;
display:block;
height:25px;
font-size:12px;
background-image:url(../afbeeldingen/menu_back.jpg);
background-repeat:repeat-x;
font-family: Verdana, Arial, Helvetica, sans-serif;
color:#FFFFFF;
text-align:center;
}
ul#menu li{
display:block;
margin-left:0;
float:left;
position: relative;}
ul#menu li a{
display:block;
color: #000000;
text-decoration:none;
padding:5px 20px 0 20px;
height:20px;
}
ul#menu li a:hover{
background-image:url(../afbeeldingen/hover_back.jpg);
background-repeat:repeat-x;
text-decoration:none;
color:#777777;
}
div#contenttotaal {
min-height:300px;
width:720px;
margin:auto;
position: inherit;
left: 340px;
top: 435px;
}
div#contentboven {
background-image:url(../images/box_content_boven.png);
background-repeat:no-repeat;
background-position:center;
height:40px;
width:720px;
}
div#contentmidden {
background-image:url(../images/box_content_midden.png);
background-repeat:repeat-y;
background-position:center;
min-height:300px;
width:720px;
margin:auto;
}
div#contentonder {
background-image:url(../images/box_content_onder.png);
background-repeat:no-repeat;
background-position:center;
height:40px;
width:720px;
margin:auto;
}
|
Fietsen is gezond, eet meer fiets |
| renevanh |
Geplaatst op 19-11-2008 |
|
Beheerder
 |
In FireFox 3.0.4 werkt het prima en ziet het er net zo uit als in IE8
Keyboard not found, press F1 to continue... |
| Fatal Mind |
Geplaatst op 19-11-2008 |
|
Moderator
 |
In Opera 9.6 nog iets ziet het er ook prima uit, kan eventueel wel screenie maken voor je ?
 |
| ngeersing |
Geplaatst op 20-11-2008 |
|
Senior lid
|
Ik heb hier de diverse browsers ook geinstalleerd. IE 7.0 wordt goed weergegeven , Opera en Firefox zorgen voor een probleempje. De boxen staan dan over het tekstvak heen terwijl die er boven moeten staan.
Lijkt mij een margin probleem, maar wanneer ik de margin ga veranderen, veranderd de opbouw in IE natuurlijk ook (terwijl die juist goed is).
Iemand nog opties hiervoor om te veranderen ?
Fietsen is gezond, eet meer fiets |
| ngeersing |
Geplaatst op 20-11-2008 |
|
Senior lid
|
Heb het probleem opgelost! In ieder geval allemaal bedankt voor de hulp.
Hier de oplossing:
Ik heb een div om de box1, box2 en box3 heen gezet, deze heb ik een hoogte opgegeven van 165px (net zo hoog als een box). Dit heeft het probleem verholpen. Mn tekstvak staat nu keurig in IE en in de andere browsers onder de boxen ipv erachter.
Fietsen is gezond, eet meer fiets |
| renevanh |
Geplaatst op 20-11-2008 |
|
Beheerder
|
Ah, zo moest het eruit zien...
De oplossing die je gebruikt hebt is inderdaad eentje die veel gebruikt wordt. Door containers om je contentdivs heen te bouwen wordt het inderdaad makkelijker om de boel goed uit te lijnen voor elke browser.
Keyboard not found, press F1 to continue... |
|
|
