DEVILofDARKNESS Posted July 6, 2009 Share Posted July 6, 2009 Okay so I want to become the same effect with div's and css, as I would have with html and <table>'s The main part does fit the right height and width, but somehow my navigation bars (left and right) don't fit their normal height... I hope somebody has the time to see what I'm doing wrong, <!-- All php codes are left away, they work fine, it's something with the div's I guess. --> <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> <html> <head> <title>ATTACK!</title> <link href="./css/index.css" rel="stylesheet" type="text/css"> <link href="./css/attack.css" rel="stylesheet" type="text/css"> </head> <body> <div id="box"> <form action='' method='post'> <div id="header"> ATTACK </div> <div id="navigation"> <iframe src='./navleft.php' height='100%' width='100%' frameborder="0" scrolling="No"></iframe> </div> <div id="main_overview"> <div class="attack_header"> Step 1: Choose Your Target </div> <div class="attack_text"> <!-- some php code left away --> <?php echo "<div class='attack_left'>" . $NYAR['region_name'] . "</div><div class='attack_right'><input type='radio' name='radioNYAR' value='" . $NYAR['region_id'] . "'></div>"; } ?> </div> <?php if($region = "visible"){ ?> <div class='attack_header'> Step 2: Choose the region from where you want to attack </div> <!-- some php code left away--> <?php echo "<div class='attack_left'>" . $YAR['region_name'] . "</div><div class='attack_right'><input type='radio' name='radioYAR' value='" . $YAR['region_id'] . "'></div>"; } }else{ echo "<div class='attack_center'>Oops You Don't have any regions</div>"; } } ?> <div class='attack_header'> Next! </div> <div class='attack_center'> <input type='submit' name='submit' value='Next!'> </div> </div> <div id="right_navigation"> <iframe src="./navright.php" frameborder="0" width="100%" height="100%" scrolling="No"></iframe> </div> <div id="footer_overview"> <iframe src="./footernav.php" frameborder='0' width="100%" height="100%" scrolling="No"></iframe> </div> </form> </div> </body> </html> And the CSS: index.css * { margin: 0; padding: 0; text-align: center; font-family: 'Times New Roman'; } body { color: #FFFFFF; width: 100%; height: 100%; background-color: #000000; } /************************* ID's *************************/ #box { width:100%; height:100%; } #header { color: red; text-decoration: underline; width: 100%; height: 5%; text-align: center; font-size: 15pt; font-weight: bold; } #main_overview { float: left; text-align: center; margin-top: 15px; width: 68%; height: 75%; } #right_navigation { float: left; text-align: center; width: 90px; height: 100%; margin-top: 15px; margin-right: 50px; margin-left: 10px; } #footer_overview { float: left; text-align: center; width: 80%; height: 14%; } /***************** Classes ******************/ h2.fnav { height: 15px; font-size: 12pt; font-weight: bold; } li.nav2 { list-style-type: none; height: 0px; } h3.rnav { height: 30px; font-size: 11pt; border-style: solid; border-color: gray; border-width: 1px; padding-top: 2px; padding-bottom: 2px; font-weight: normal; } h3.fnav { height: 15px; font-size: 11pt; font-weight: normal; } img.rnav { height: 30px; width: 100px; border-style: solid border-color: white border-width: 1px; padding-top: 2px; padding-bottom: 2px; } attack.css div.attack_header { float: left; font-weight: bold; height: 25px; width: 100%; margin-top: 15px; margin-bottom: 15px; } div.attack_left { float: left; height: 25px; width: 69%; } div.attack_right { float: left; height: 25px; width: 30%; } div.attack_center { float: left; height: 25px; width: 100%; } Quote Link to comment Share on other sites More sharing options...
haku Posted July 6, 2009 Share Posted July 6, 2009 You didn't really describe your problem with enough detail for me to be sure what you mean, but I'm going to take a guess that it's probably 'faux columns' that you want. Quote Link to comment Share on other sites More sharing options...
DEVILofDARKNESS Posted July 6, 2009 Author Share Posted July 6, 2009 well I'm not sure what the problem is but I think it is 'faux columns' , Quote Link to comment Share on other sites More sharing options...
haku Posted July 6, 2009 Share Posted July 6, 2009 Did you even try to find out what 'faux columns' are? Quote Link to comment Share on other sites More sharing options...
DEVILofDARKNESS Posted July 7, 2009 Author Share Posted July 7, 2009 Ofcourse I did, ! Okay I don't use a background image to make the rows same height,... maybe I should try that out first. Quote Link to comment Share on other sites More sharing options...
Recommended Posts
Join the conversation
You can post now and register later. If you have an account, sign in now to post with your account.