sepoto
-
Posts
254 -
Joined
-
Last visited
Content Type
Profiles
Forums
Events
Everything posted by sepoto
-
So essentially I had to do things with jQuery. I am just wondering if there are any thoughts on how CSS seems to handle these elements... What I ended up with I think is good so I may as well share the solution... <?phprequire_once('includes/i_rsslib.php');require_once('functions/f_lib.php');?><!DOCTYPE html><html><head><title>Daily Sports Guide</title><link type="text/css" rel="stylesheet" href="style/style.css"><link type="text/css" rel="stylesheet" href="style/suckerfish.css"><script type="text/javascript" src="jquery/jquery-1.8.0.js"></script><script type="text/javascript"> $(document).ready(function(){ if( $("#content-left").height() < $("#content-right").height() ){$("#content-left").css("height", $("#content-right").height() );}else{$("#content-right").css("height", $("#content-left").height() );} }); </script><style>#content { clear: both; margin: 0px; padding: 0px; border: 1px solid white; width: 798px; overflow: hidden; height: auto; }#content-left { float: left; margin: 0px; padding: 0px; width: 397px; border: 1px solid blue; }#content-right { float: left; margin: 0px; padding: 0px; width: 397px; border: 1px solid blue; }</style></head><body><div id="wrapper"><?php require_once('includes/i_header.php'); ?> <div id="content"><div id="content-left">Four score and seven years ago...</div><div id="content-right">Four score and seven years ago...Four score and seven years ago...Four score and seven years ago...Four score and seven years ago...</div></div> <div id="msgid"></div></div></body></html>
-
<?phprequire_once('includes/i_rsslib.php');require_once('functions/f_lib.php');?><!DOCTYPE html><html><head><title>Daily Sports Guide</title><link type="text/css" rel="stylesheet" href="style/style.css"><link type="text/css" rel="stylesheet" href="style/suckerfish.css"></head><body><div id="wrapper"><?php require_once('includes/i_header.php'); ?> <div style='margin: 5px; padding: 5px; border: 1px solid white; height: auto; clear: both; overflow: hidden;'><div style='float: left; width: 48%; height: 100%; border: 1px solid blue; overflow: hidden;'>Four score and seven years ago our fathers brought forth on this continent, a new nation, conceived in Liberty, and dedicated to the proposition that all men are created equal.Now we are engaged in a great civil war, testing whether that nation, or any nation so conceived and so dedicated, can long endure. We are met on a great battle-field of that war.We have come to dedicate a portion of that field, as a final resting place for those who here gave their lives that that nation might live. It is altogether fitting and proper that we should do this.But, in a larger sense, we can not dedicate -- we can not consecrate -- we can not hallow -- this ground. The brave men, living and dead, who struggled here, have consecrated it, far above our poor powerto add or detract. The world will little note, nor long remember what we say here, but it can never forget what they did here. It is for us the living, rather, to be dedicated here to the unfinished workwhich they who fought here have thus far so nobly advanced. It is rather for us to be here dedicated to the great task remaining before us -- that from these honored dead we take increased devotion tothat cause for which they gave the last full measure of devotion -- that we here highly resolve that these dead shall not have died in vain -- that this nation, under God, shall have anew birth of freedom -- and that government of the people, by the people, for the people, shall not perish from the earth.</div><div style='float: left; width: 48%; height: 100%; border: 1px solid blue; overflow: hidden; margin: 0px 0px 0px 5px;'>Governor Stevenson, Senator Johnson, Mr. Butler, Senator Symington, Senator Humphrey, Speaker Rayburn, Fellow Democrats, I want to express my thanks to Governor Stevenson for his generous and heart-warming introduction.It was my great honor to place his name in nomination at the 1956 Democratic Convention, and I am delighted to have his support and his counsel and his advice in the coming months ahead.With a deep sense of duty and high resolve, I accept your nomination.I accept it with a full and grateful heart--without reservation-- and with only one obligation--the obligation to devote every effort of body, mind and spirit to lead our Party back to victory and our Nation back to greatness.I am grateful, too, that you have provided me with such an eloquent statement of our Party's platform. Pledges which are made so eloquently are made to be kept. "The Rights of Man"--the civil and economicrights essential to the human dignity of all men--are indeed our goal and our first principles. This is a Platform on which I can run with enthusiasm and conviction.</div></div> </div></body></html> So I have created this skeleton example of a two column layout. While the content of each column may vary I would like the borders of each column to match each other. I thought that I might be able to put the columns in a wrapper, float them and then use the 'height: 100%' CSS property on both columns. Unfortunately, solving the problem is not that simple. Does anyone know a way to do this? I had a layout before that was alright but if I could somehow get to the solution for this one it would look that much nicer. Is what I am trying to achieve with the layout possible? I uploaded a live copy to http://dailysportsguide.com/prototype/. Thanks again and in advance for any of your most useful comments and suggestions. P.S. I already have a plan to accomplish the same goal with some jQuery however if this can be done with CSS I would much prefer that method...
-
As you say it: <div style='clear: both; margin: 5px; padding: 0px; border: 1px solid white;'><p style='color: white;'>Facebook comments area:</p></div> I greatly appreciate the patience. The clear property I am not very familiar with yet but I see how it can be very useful. Again thank you kindly. You did have the solution.
-
So what I am really trying to understand is why I see the one pixel solid white border for the facebook comments div only on the left, right and bottom. The top border is blocked out for some reason. I have tried numerous times to apply a top margin to the facebook comments div. I tried also using a few <br>'s. Seemingly nothing will move the facebook comments div into position where I can see the border on all four sides. I've ruled out margins and paddings for the two container objects of columns one and two above and also for col1 and col2 themselves.
-
<?phprequire_once('includes/i_rsslib.php');require_once('functions/f_lib.php');?><!DOCTYPE html><html><head><meta http-equiv="Content-Type" content="text/html; charset=utf-8"><title>Daily Sports Guide</title><link type="text/css" rel="stylesheet" href="style/style.css"><link type="text/css" rel="stylesheet" href="style/suckerfish.css"></head><body> <div id="wrapper"> <?php require_once('includes/i_header.php'); ?> <!-- start columns left and right --><div id="container2"><div id="container1"> <div id="col1"><?php include("index_leftcolumn.html"); ?></div> <!-- column break --> <div id="col2"><div id="col2inner"><h4 id="latestFromDSG">Latest from DSG</h4><div style='margin: 5px; padding: 0px; color: white; background-color: black;'><?php require_once('index_twitterfeed.php'); ?></div></div></div> </div></div><!-- end columns left and right --> <div style='margin: 5px; padding: 0px; border: 1px solid white;'><p style='color: white;'>Facebook comments area:</p></div> </div></body></html> body { background-color: black; text-align: center; }img { border: none; margin: 0; padding: 0; }a:visited { color: white; } #wrapper { width: 800px; margin: 0px auto; color: white; background-color: black; border: 1px solid red; text-align: left; padding: 0px 0px 0px 0px; height: auto; overflow: hidden;} #header { margin: 0px; padding: 0px; width: 100%; height: 141px; }#hcolumnLeft { float: left; width: 300px; background-color: blue; margin: 0px; padding: 0px; color: white; height: 141px; }#hcolumnRight { float: right; margin: 0px; padding: 0px; color: white; background-color: black; width: 500px; height: 141px; text-align: right; } #container2 { clear:left; float:left; width:100%; overflow:hidden; background: black; }#container1 { float:left; width:100%; position:relative; right:30%; background: black; }#col1 { float:left; width:70%; position:relative; left:30%; overflow:hidden; }#col2 { float:left; width:30%; position:relative; left:30%; overflow:hidden; } #latestFromDSG { font-size: 16px; margin: 0px 0px 10px; padding: 5px; background: #0100FE; }#col2inner { margin: 5px; padding: 0px; border: 1px solid white; background-color: black; } For some reason when I look at the CSS in Firebug I see that the facebook comments area thinks that it starts all the way at the top of #wrapper. This is not my intent at all. In fact my intent is to have the facebook comments area starting below the two column layout but still inside #wrapper. As usual with CSS trying to figure this out is not at all logical to me and not at all easy to understand. I see what the problem is but I really feel clueless on how to fix it. I had it in mind to upload a live copy to my server but for some reason I can not determine yet my PHP includes which are working fine on my IIS, PHP server are not working at all when I upload the files to CentOS 6, PHP server. Really I have to get the CSS right before I can figure out what is wrong with Cent OS. Thanks in advance for any help, comments or suggestions...
-
Indeed... Setting #wrapper { overflow: hidden; } and the border is behaving properly now. I will need to familiarize myself with this property and its workings. Thank you both for your prompt replies. -
http://dailysportsguide.com/prototype/index.php body { background-color: black; text-align: center; }img { border: none; margin: 0; padding: 0; }a:visited { color: white; } #wrapper { width: 800px; margin: 0px auto; color: white; background-color: red; border: 1px solid white; text-align: left; padding: 0px 0px 0px 0px; height: auto;} #header { margin: 0px; padding: 0px; width: 100%; height: 141px; }#hcolumnLeft { float: left; width: 300px; background-color: blue; margin: 0px; padding: 0px; color: white; height: 141px; }#hcolumnRight { float: right; margin: 0px; padding: 0px; color: white; background-color: green; width: 500px; height: 141px; text-align: right; } #container { width: 100%; padding: 0px; margin: 0px; color: red; background-color: blue; height: auto; }#columnLeft { width: 50%; float: left; color: red; margin: 0px; padding: 0px; background-color: yellow;}#columnRight { width: 50%; float: right; color: red; margin: 0px; padding: 0px; background-color: white; } index.php <!DOCTYPE html><html><head><meta http-equiv="Content-Type" content="text/html; charset=utf-8"><title>Daily Sports Guide</title><link type="text/css" rel="stylesheet" href="style/style.css"><link type="text/css" rel="stylesheet" href="style/suckerfish.css"></head><body><div id="wrapper"><?php require_once('includes/i_header.php'); ?> <div id="container"><div id="columnLeft"><p>Test p!</p></div><div id="columnRight"><p>Test p!</p></div></div> </div></body></html> So clearly I have written #columnLeft and #columnRight to be enclosed inside #wrapper. When I look at the page however the solid white border of #wrapper has not carried down below #columnLeft and #columnRight. In fact #columnLeft and #columnRight appear to be totally outside of #wrapper which is not my intent. Did I perhaps do something wrongly with #container? The height of wrapper should be auto so all the elements should then be contained inside of #wrapper. This is odd. There must be something wrong with my code! Thanks in advance!
-
Brain freeze! Thanks!
-
<!DOCTYPE html><html><head><meta http-equiv="Content-Type" content="text/html; charset=utf-8"><title>Daily Sports Guide</title><link type="text/css" rel="stylesheet" href="style/style.css"><link type="text/css" rel="stylesheet" href="style/suckerfish.css"></head><body><div id="wrapper"><?php require_once('includes/i_header.php'); ?><p style='background-color: black; margin: 0px; padding: 0px;'>Daily Sports Guide</p></div></body></html> style.css body { background-color: black; text-align: center; }img { border: none; margin: 0; padding: 0; }a:visited { color: white; } #wrapper { width: 800px; margin: 0px auto; color: white; background-color: red; border: 1px solid white; text-align: left; padding: 0px 0px 0px 0px; height: auto;} #header { margin: 0px; padding: 0px; width: 100%; height: 150px; }#hcolumnLeft { float: left; width: 300px; background-color: blue; margin: 0px; padding: 0px; color: white; height: 141px; }#hcolumnRight { float: right; margin: 0px; padding: 0px; color: white; background-color: green; width: 500px; height: 141px; text-align: right; } suckerfish.css #nav, #nav ul { /* all lists */padding: 0;margin: 0;list-style: none;line-height: 1;}#nav a {color: white;text-decoration: none;background-color: black;text-align: center; display: block;width: 100px;}#nav a:hover {display: block;background: blue;width: 100px;}#nav li { /* all list items */float: left;width: 100px; /* width needed or else Opera goes nuts */} #nav li ul { /* second-level lists */position: absolute;border: 1px solid white;background: black;width: 100px;left: -999em; /* using left instead of display to hide menus because display: none isn't read by screen readers */} #nav li ul ul { /* third-and-above-level lists */margin: -1em 0 0 10em;} #nav li:hover ul ul, #nav li.sfhover ul ul {left: -999em;} #nav li:hover ul, #nav li li:hover ul, #nav li.sfhover ul, #nav li li.sfhover ul { /* lists nested under hovered list items */left: auto;} i_header.php <div id="header"><!-- The Header --> <div id="hcolumnLeft"><img src="img/logo.jpg"></div> <div id="hcolumnRight"><!-- Suckafish navigation menu --><ul id="nav"> <li><a href="#"> </a></li> <li><a href="index.php">Home</a></li> <li><a href="profile.php">My Profile</a> <ul> <li><a href="myguide.php">My Guide</a></li> <li><a href="bars.php">DSG Sports Bars</a></li> <?php if($_SESSION['logged_in']) {echo "<li><a href=\"logout.php\">Logout</a></li>"; } else {echo "<li><a href=\"login.php\">Login</a></li>"; } ?></ul> </li> <li><a href="aboutus.php">About Us</a></li> <li><a href="contactus.php">Contact Us</a></li> </ul><!-- End #nav --></div> </div><!-- End #header --> I just am not able to determine why for some reason there is that small red margin there. I know it is part of wrapper but I can't figure out why it is there. As far as my code goes it shouldn't be because #header, #hcolumnLeft and #hcolumnRight all have no padding or margin area. What could be causing this problem? The url of the page is http://dailysportsguide.com/prototype/index.php. Thanks in advance for any comments or suggestions on how to deal with this red margin area of #wrapper!
-
A great suggestion. I have started to wonder myself why I should be bothering with the complexities of XML. Perhaps I will build a .CSV directly to JSON. XML would be more fun though.
-
Thank you Birbal! Those are excellent resources!
-
It looks very complicated! Could I see some code that would pertain to my data? I am seeing how to load and save the file that is easy. What looks much harder is how would be the best way to encode my data.
-
Not yet!
-
I have some data in a flat file. These are the fields: nameaddressziplatlng A row of data might look something like: fishing hole #1, Catalina Island U.S., 90704, 33.3, 118.4 There are fifty rows of data. I am trying with PHP to encode this data into an XML file. The ultimate goal is that the data will be stored on the disk in XML format and when requested PHP will read the XML file and retrieve the data and put it into an array so I can encode the data in JSON and send it back off to JavaScript (AJAX). I'm very familiar with working with flat files and SQL however XML is a bit unfamiliar to me as of yet. How would this be accomplished? Good Evening W3Schools!
-
That was a great explanation. Thank you for your reply.
-
I had some code and recently I moved over to a new server which happens to be running Debian 5.0 Lenny. I had some code involving page redirection that stopped working and I had to add ob_start(); to the top of the .php files in question to get them working again. I read some documentation for ob_start(); but I have to admit it did not make sense to me at all. Why am I unable to send my headers unless ob_start(); has been invoked first? Is there a stack someplace being created? If so is it a stack only for header information? What exactly is ob_start(); doing? Thank you!
