Jump to content

rassul

Members
  • Posts

    15
  • Joined

  • Last visited

Everything posted by rassul

  1. rassul

    CSS Box margin

    Thank you. Applied the overflow and it worked.
  2. rassul

    CSS Box margin

    <html lang="en"> <head> <meta charset="utf-8"> <title> Title </title> <style> * { margin: 0; padding: 0; } #outerbox { background-color: gray; width: 300px; height: 300px; } #innerbox { width: 100px; height: 100px; background-color: green; border: 1px solid black; /*margin: 10px;*/ } </style> </head> <body> <div id="outerbox"> <div id="innerbox"></div> </div> </body></html> The above code's result is: but if I uncomment margin for innerbox the result is: Shouldn't the margin applied to innerbox and not the outerbox? Thanks in advance.
  3. Thanks for everybody's suggestions. I changed all of my html files' extensions from .html to .php and now it works.
  4. I am inserting <?php include('footer.php'); ?> in my index.html file.
  5. I am using wamp. Here is my footer.php:<?php echo "<p>This is footer</p>";?> and place <?php include('footer.php'); ?> where the footer should be, but does not work.
  6. How would you do it using PHP?
  7. Thanks for the response. I do know some PHP. But can it be done via Javascript?
  8. Hello, I have several pages that have exact the same footing text. How would I have the content in one place and somehow refer to it in my footer div of each page? Thank you in advance.
  9. I need to simply use a different fonts for that one column only.
  10. I have the following table. I need to change the font for the 'Population' column only so the numbers are lined up. How is it done in CSS so I don't have to do it row by row? Thanks in advance. <!DOCTYPE html><html><head> <meta charset="utf-8"> <title></title> <style type="text/css" media="screen"> tr:nth-of-type(2n+3) { background-color: #C0C0C0 ; } </style></head><body> <div id="container"> <table border="1" align="center" bgcolor="white"> <th>Country</th> <th>Capital</th> <th>Population</th> </tr> <tr> <td>Algeria</td> <td>Algiers</td> <td>35,980,193</td> </tr> <tr> <td>Belgium</td> <td>Brussels</td> <td>11,008,0000</td> </tr> <tr> <td>Chad</td> <td>N'Djamena</td> <td>11,525,496</td> </tr> <tr> <td>Chad</td> <td>N'Djamena</td> <td>11,525,496</td> </tr> </table> </div></body></html>
  11. Resolved, thanks to both of you, deldalton and Ingolme.
  12. Hi, I have a fluid layout that expands/shrinks as changing the browser's width. The issue is when I make the browser's width narrower then boxes fall apart. Your help is appreciated with perhaps some explanation. Pictures are attached for further help. Thanks in advance. <!DOCTYPE html><html><head> <meta charset="utf-8"> <title></title> <style type="text/css" media="screen"> * { margin: 0; padding: 0; } #container { width: 80%; height: 300px; margin-left: auto; margin-right: auto; background: gray; } #header { height: 65px; background: #FF6600; text-align: center; } #content { height: 190px; width: 70%; float: left; background: ##FFFF66; min-width: 300px; } #side { width: 29%; height: 190px; float: right; background: #A3C266; min-width: 100px; } #footer { clear: both; height: 35px; background: #FFA366; } ul { list-style-type: none; padding: 10px;} p {text-align: center;} #content p {text-align: left; padding: 5px;} </style></head><body> <div id="container" > <div id="header"> <h1>This is a test</h1> <h3>April 3, 2013</h3> </div> <div id="content"> <p>Lorem ipsum Etiam eget dui. Aliquam erat volutpat. Sed at lorem in nunc porta tristique. Proin nec augue.</p> </div> <div id="side"> <ul> <li> <a href="#">Item 1</a> </li> <li> <a href="#">Item 2</a> </li> <li> <a href="#">Item 3</a> </li> <li> <a href="#">Item 4</a> </li> </ul> </div> <div id="footer"> <p>University</p> </div></div> </body></html>
  13. I uploaded the same image twice, ignore one.
  14. I have a div called footer that falls outside of its container parent. Please refer to the picture. Please help me to fix it. Thanks in advance. <!DOCTYPE html><html><head> <meta charset="utf-8"> <title></title> <style type="text/css" media="screen"> * {margin: 0; padding: 0; } #container {width: 70%; height: 400px; background: gray; border: 2px solid black; } #side {width: 30%; height: 400px; background: #FF6600; overflow: auto; text-align: center; float: right; } #footer {width: 100%; height: 45px; background: yellow; clear: both; } </style></head><body><div id="container" >Container <div id="side">Side</div> <div id="footer">Footer</div></div></body></html>
×
×
  • Create New...