Jump to content

Search the Community

Showing results for tags 'css'.



More search options

  • Search By Tags

    Type tags separated by commas.
  • Search By Author

Content Type


Forums

  • Welcome to PHP Freaks
    • Announcements
    • Introductions
  • PHP Coding
    • PHP Coding Help
    • Regex Help
    • Third Party Scripts
    • FAQ/Code Snippet Repository
  • SQL / Database
    • MySQL Help
    • PostgreSQL
    • Microsoft SQL - MSSQL
    • Other RDBMS and SQL dialects
  • Client Side
    • HTML Help
    • CSS Help
    • Javascript Help
    • Other
  • Applications and Frameworks
    • Applications
    • Frameworks
    • Other Libraries
  • Web Server Administration
    • PHP Installation and Configuration
    • Linux
    • Apache HTTP Server
    • Microsoft IIS
    • Other Web Server Software
  • Other
    • Application Design
    • Other Programming Languages
    • Editor Help (Dreamweaver, Zend, etc)
    • Website Critique
    • Beta Test Your Stuff!
  • Freelance, Contracts, Employment, etc.
    • Services Offered
    • Job Offerings
  • General Discussion
    • PHPFreaks.com Website Feedback
    • Miscellaneous

Find results in...

Find results that contain...


Date Created

  • Start

    End


Last Updated

  • Start

    End


Filter by number of...

Joined

  • Start

    End


Group


AIM


MSN


Website URL


ICQ


Yahoo


Jabber


Skype


Location


Interests


Age


Donation Link

Found 41 results

  1. So I'm posting this in CSS because I think I'm having a CSS issue. Basically, I have this right now: I'm trying to vertically center the blue box and everything inside it. I've tried line-height, vertical-align, display: inline-block, position relative and absolute. The only way that works is if I do it manually with absolute or margin. But absolute isn't responsive so that's a problem. I'm using Bootstrap from the CDN if that matters. I'm only going to include code for the first box so that it doesn't get messy. HTML: <div class="container category-forums clearfix"> <div class="container category-forums-wrap"> <div class="container category-icon clearfix"></div> <div class="container forum-details-wrapper clearfix"> <div class="container forum-details-container"> <p class="forum-name">News Center</p> <p class="forum-desc">Stay up to date with all the latest news and, more importantly, familiarize yourself with the rules.</p> <div class="sub-forum-container container clearfix"> <p class="sub-forums clearfix">Sub-Category 1</p> <p class="sub-forums clearfix">Sub-Category 2</p> <p class="sub-forums clearfix">Sub-Category 3</p> </div> </div> </div> <div class="container forum-threads clearfix"> <h4>108</h4> <p>Threads</p> </div> <div class="container forum-posts clearfix"> <h4>2000</h4> <p>Posts</p> </div> <div class="container forum-latest-posts clearfix"> <div class="container last-avatar clearfix"></div> <p>Lastest thread</p> <p>Yesterday 3:15pm</p> </div> </div> </div> CSS: .category-forums { width: 100%; height: 41%; background-color: #ecf0f1; padding: 0; border-bottom-left-radius:.25rem!important; border-bottom-right-radius:.25rem!important; } .category-icon { width: 7%; height: 100%; border-right: 1px dotted lightgray; margin: 0; float: left; line-height: 100%; } .category-forums-wrap { height: 70%; width: 100%; border: 1px dotted blue; padding: 0; display: inline-block; vertical-align: middle; } .forum-details-wrapper { width: 55%; height: 100%; border-right: 1px dotted lightgray; margin: 0; float: left; padding: 0; } .forum-details-container { width: 100%; height: 100%; border: 1px dotted gray; margin: 0; } .forum-name { margin: 0; } .sub-forum-container { width: 100%; float: left; margin: 0; } .sub-forums { width: 31%; margin: 0; float: left; } .forum-desc { margin: 0; font-size: 1.3rem; } .forum-threads { width: 9%; height: 100%; border-right: 1px dotted lightgray; float: left; text-align: center; line-height: 100%; } .forum-posts { width: 9%; height: 100%; border-right: 1px dotted lightgray; float: left; line-height: 100%; } .forum-latest-posts { width: 20%; height: 100%; float: left; } .last-avatar { width: 25%; height: 100%; border-right: 1px dotted lightgray; float: left; text-align: center; line-height: 100%; } I'm having a tough time even centering the text vertically.
  2. I created a login system with bootstrap but for some reason I cannot delete the "placeholder" (in which it is written "admin") in both the inputs of the form ("uname" and "psw"). Even if I change the placeholder it's remain "admin". Have you any idea? This is the code: <!DOCTYPE html> <html> <head> <title>Login</title> <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.4.0/css/bootstrap.min.css"> <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script> <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.4.0/js/bootstrap.min.js"></script> <link rel="stylesheet" type="text/css" href="css/styles.css"> </head> <body> <div class="container"> <div class="jumbotron text-center" id="jumbo_log"> <h1>Login Page</h1> <p>You must login to enter</p> <form id="theform" method="get"> <div class="container2"> <label for="uname"><b>Username</b></label> <input type="text" id= "uname" name="uname" required><br> <label for="psw"><b>Password</b></label> <input type="password" id="psw" name="psw" required><br><br> <input type="submit" id="submit" class="btn btn-info" value="Login"><br><br> <a class="btn btn-primary" href="registration.php" role="button">Click here if you are not registered</a> </div> </form> </div> </body> </html>
  3. In general if I know how to do something I want to do I can code it in a language I'm less than fluent in, if I am fluent in a language I can figure out how to code something I want to do but don't know very well how to do it, but this time I have almost no clue how to do what I want to do and very limited fluency in JS. I want a script that will slowly fade from one color (red, green, blue, white, black) to a neutral color (grey) and then fade into one of the randomly selected other 4 colors. Then repeat. Forever. So like Rd>gy>wt>bu>gy>bk etc. I have no clue what to do, if you can help I will be grateful for all time. Oh, and I need to make sure the text color is always contrasting so it can be read, so I need to adjust that too?
  4. Guest

    Get Image from CSS

    how can I use file_get_contents to: 1: detect if '#header-cover-image' is in the page, and if so.. 2: Get the URL out of background-image: url(); /* Cover image */ body.buddypress div#item-header #header-cover-image { background-image: url(https://www.mywebsite.com/wp-content/uploads/buddypress/groups/34/cover-image/cover-image.jpg); background-repeat: no-repeat; background-size: cover; background-position: center center !important; }
  5. Hello, I am looking for a css dev to complete a navigation menu (or replace it). I will give you the current code (static html and css) you will have to create the css on your own server. Please do not ask for me to create an environment for you to work in. The dev needs good English, French or Dutch language skills to communicate. After the navigation menu is finished, more work for general layout is possible. you can look at the current version here http://www.test.anatak.com/en/twintipFusion3lw.php payment will be made by paypal after delivery 5000 yen for the navigation with general layout of website CSS navigation in CSS and HTML (No javascript) Responsive style for mobile devices general layout for site (div for navigation, content and footer) thank you anatak Please contact me on info [@] anatak.com
  6. Hello, I am looking for a css dev to complete a navigation menu (or replace it). I will give you the current code (static html and css) you will have to create the css on your own server. Please do not ask for me to create an environment for you to work in. PS The dev needs good English, french or dutch language skills to communicate. After the navigation menu is finished, more work for general layout is possible. thank you anatak
  7. Check out http://mainlypiano.com/ and start typing in the search box ("dav" will get you several results). Notice that the search box goes below the middle light purple box. There's no z-index here to cause an issue. If one removes the relative position of the light purple box, the search results menu shows in its entirety. That's weird, isn't it? (That messes up the "favorite albums" text there, which is the point of the relative position, but lets you see the error.) Any idea why this is happening?
  8. Hello Experts, I need help on a wordpress plugin "Easy Student Results". I installed this plugin for my ITI Institute results and when entered all institution trades, courses, students separated with trades and then started adding results on the basis of trades then this plugin doesn't show results of all trades students. It only shows results of firstly created trades students results. All other trades students results are showing unavailability error. So i need your help. https://wordpress.org/plugins/easy-student-results Thank you Manish Bajpai
  9. Hi there, I have a page of products listed on a categories page, at the minute the mysql results are split into 3 columns, but when the page opens on a larger / high res screen there is a lot of space down the right hand side of the products. I was hoping someone might be able to help me so these move when necessary. I have pasted the categories page, if anything else is needed please let me know. Hope to hear from someone. thanks. MsKazza <?php session_start(); include('Connections/adlantic.php'); ?> <!doctype html> <html> <head> <style> /* Remove the navbar's default margin-bottom and rounded borders */ .pagination { background: #0066FF; border-radius: 15px; } .rest { font:Arial, Helvetica, sans-serif; color:#0066FF; float: left; padding: 8px 8px; text-decoration: none; border: 1px solid #ddd; margin: 0 4px; transition: background-color .3s; } .rest a { color:#0066FF; text-decoration:none; transition: background-color .3s; } /* Set height of the grid so .sidenav can be 100% (adjust as needed) */ .active { font:Arial, Helvetica, sans-serif; color:#ffffff; background:#0066FF; float: left; padding: 8px 8px; text-decoration: none; border: 1px solid #ddd; margin: 0 4px; } </style> <?php $recordID = $_GET["recordID"]; $result_category = mysqli_query($con, "SELECT products.*, categories.* FROM products INNER JOIN categories ON products.category=categories.id WHERE cat_name='$recordID' AND products.product_publish='1'"); $row_category = mysqli_fetch_assoc($result_category); $metatitle= $row_category['cat_name']; $metadesc=$row_category['cat_name']; $metakeywords=$row_category['cat_name'] . "business gifts, corporate gifts, promotional products, promotional items, promotional merchandise, promotional giveaways, advertising products, sales promotion, giveaways, exhibition, conference, environmentally friendly products, eco products, printed"; include('header.php'); ?> <meta http- equiv="content-type" content="text/html;charset=UTF-8"> <script src="js/lightbox-2.6.min.js"></script> <script type="text/javascript"> $(function() { //More Button $('.more').live("click",function() { var ID = $(this).attr("id"); if(ID) { $("#more"+ID).html('<img src="moreajax.gif" />'); $.ajax({ type: "POST", url: "ajax_more.php", data: "lastmsg="+ ID, cache: false, success: function(html){ $("ol#updates").append(html); $("#more"+ID).remove(); } }); } else { $(".morebox").html('The End'); } return false; }); }); </script> <link href="css/lightbox.css" rel="stylesheet" /> <br /> <div style="clear: both;"> <br /> <div class="content-area"> <div class="page-content"> <div class="product"> <div class="product-name">Categories</div> <div class="product-info" style="background:#E5E4E4; margins:auto;"> <br /> <table border=0 width="550px" align="center" cellpadding="5" cellspacing="5" bgcolor="#FFFFFF"><tr> <?php $result = mysqli_query($con, "SELECT * FROM sub_categories WHERE cat_name='$recordID' ORDER BY subcat_name ")or die($result. "<br/><br/>".mysql_error()); $count = 0; $max = 4; while($row = mysqli_fetch_assoc($result)) { if (['$result'] > 0){ $count++; echo '<td style="padding:5px;"><img src="eCommerceAssets/images/arrow.png"> <a href="sub_category.php?recordID='.$row['id'].'" class="topbar">'.$row['subcat_name'].'</a></td>'; if($count >= $max){ //reset counter $count = 0; //end and restart echo '</tr><tr>'; } } elseif ($result = 0) { echo 'There are no Subcategories available.'; } } ?> </tr></table> <?php $recordID = $_GET["recordID"]; // find out how many rows are in the table $query = mysqli_query($con, "SELECT COUNT(*) FROM products WHERE category='$recordID' AND product_publish='1'"); $r = mysqli_fetch_array($query); $numrows = $r[0]; // number of rows to show per page $rowsperpage = 18; // find out total pages $totalpages = ceil($numrows / $rowsperpage); // get the current page or set a default if (isset($_GET['currentpage']) && is_numeric($_GET['currentpage'])) { // cast var as int $currentpage = (int) $_GET['currentpage']; } else { // default page num $currentpage = 1; } // end if // if current page is greater than total pages... if ($currentpage > $totalpages) { // set current page to last page $currentpage = $totalpages; } // end if // if current page is less than first page... if ($currentpage < 1) { // set current page to first page $currentpage = 1; } // end if // the offset of the list, based on current page $offset = ($currentpage - 1) * $rowsperpage; // get the info from the db $query = "SELECT * FROM products INNER JOIN images ON products.product_code=images.product_code WHERE category=$recordID AND product_publish='1' ORDER BY product_id ASC LIMIT $offset, $rowsperpage"; $rs_result = mysqli_query($con, $query); $cat_name = $row_category['cat_name']; // always make sure you get a valid result!!! if($result == false) { die("Query failed: ".mysqli_error().PHP_EOL.$query); } echo "<br /><br />"; echo "<b>You are viewing page " . $currentpage . " of " . $totalpages . "</b><br />"; echo "We found " . $numrows . " products <br />"; ?> <?php if ($rs_result == NULL) { echo "There are no products to display in this category"; } else { ?> <br /><br /> <table align="center" border=0 width="550px" cellpadding="5" cellspacing="5"><tr> <?php $count1 = 0; $max1 = 3; while($row1 = mysqli_fetch_assoc($rs_result)) { $prod_name = $row1['product_name']; if(strlen($prod_name)>24){ $prod_name=substr($prod_name,0,24).' ...'; } if (['$rs_result'] > 0){ $count1++; echo '<td align="center" valign="top">'; echo '<table align="center" bgcolor="#ffffff" width="160"><tr><td height="5" align="center">'; echo '</td></tr><tr><td align="center">'; echo '<a href="product.php?name='; echo $row1['slug']; echo '" class="topbar">'; echo '<img src="eCommerceAssets/images/products/'; echo $row1['product_image_big1']; echo '" width="150" height="200">'; echo '</a>'; echo '</td></tr><tr><td align="center">'; echo '<strong><a href="product.php?name='; echo $row1['slug']; echo '" class="prod-name">'; echo $prod_name; echo '</a></strong><br />'; echo '<a href="product.php?name='; echo $row1['slug']; echo '" class="button">More Info</a><br />'; echo '</td></tr></table><br /><br />'; echo '</td>'; if($count1 >= $max1){ //reset counter $count1 = 0; //end and restart echo '</tr><tr>'; } } elseif ($rs_result = 0) { echo 'There are no products available.'; } } ?> </tr></table> <?php } // close while loop echo "<br />"; /****** build the pagination links ******/ // range of num links to show $range = 3; // if not on page 1, don't show back links if ($currentpage > 1) { // show << link to go back to page 1 echo "<span class='rest'> <a href='?recordID=$recordID&currentpage=1'><<</a> </span>"; // get previous page num $prevpage = $currentpage - 1; // show < link to go back to 1 page echo "<span class='rest'> <a href='?recordID=$recordID&currentpage=$prevpage'><</a></span> "; } // end if // loop to show links to range of pages around current page for ($x = ($currentpage - $range); $x < (($currentpage + $range) + 1); $x++) { // if it's a valid page number... if (($x > 0) && ($x <= $totalpages)) { // if we're on current page... if ($x == $currentpage) { // 'highlight' it but don't make a link echo "<span class='active'> <b>$x</b> </span>"; // if not current page... } else { // make it a link echo "<span class='rest'><a href='?recordID=$recordID&currentpage=$x'>$x</a> </span>"; } // end else } // end if } // end for // if not on last page, show forward and last page links if ($currentpage != $totalpages) { // get next page $nextpage = $currentpage + 1; // echo forward link for next page echo "<span class='rest'> <a href='?recordID=$recordID&currentpage=$nextpage'>></a></span>"; // echo forward link for lastpage echo "<span class='rest'> <a href='?recordID=$recordID&currentpage=$totalpages'>>></a></span>"; } // end if /****** end build pagination links ******/ // close if ?> </div> </div> </div><!-- end of page-content --> <div class="left-side"> <?php include('menu.php'); ?> </div><!-- end of left side panel --> </div><!--end of content-area--> <br /> <div style="clear: both;"><br /> <?php include('footer.php'); ?> </div> <script src="js/cbpFWTabs.js"></script> <script> new CBPFWTabs( document.getElementById( 'tabs' ) ); </script> </body> </html>
  10. Over the past year I started using composer and have realized that using a dependency manager keeps development and code maintenance so much easier. yay composer! I can see an equally big need to do this for front side technologies (ie: js & css) What exists for us PHP developers to help maintain that huge mess of front end stuff we need to include. Is there something to manage and minify JS/CSS that works well with the PHP environment? Thanks
  11. Hey! I want to create a website that can test your counting pace. I’ll make colored, square div that change color after 10 to 30 seconds when you hover over it, and then you’ll type down how long you think it took in a form to check if you’re right. My solution to do this is to create the PHP variable $time = rand(10,30), and in CSS get the div:hover transition-delay to be $time. Then, after the form, I need the same variable for if($_POST[timeguess] = $time) {echo “Correct!”}. I have no idea how to access the same variable in both the CSS and HTML, so I hope some of you can help me out! Thanks
  12. Hi, I hope I am in the right place for some help. If not, I apologize I have just installed e-fiction on my website and I am having a little issue with some of the codes and where I need to go to modify things. This is a screenshot of the page and what I am trying to modify. What I want to do is make the banner CENTERED. This I thought was easy but whatever I do, it doesn't seem to work. I must be looking in the wrong place. Secondly, I want to move the menu bar - HOME - MEMBERS - SEARCH etc underneath the banner and that too to be centered. I am going to upload the files to Sendspace ( http://www.sendspace.com/file/mi0i6e), as the zip is too big to upload here and I am unsure which files need to be modified (that is where I am stuck) Thank you SO much, and I hope someone can help me. I am trying to learn all of this and it's all so confusing
  13. I have this jquery code below. It basically shows a new div when mouse hover over another div. It works. But I noticed that on page load, it sometimes shows 1 or 2 products already hovered and showing the ".show-details" content. This doesn't happen on every page and sometimes it's only 1 product and sometimes it's 2 products. And they vary in the positions on a page. Do you know why it's doing that and how to fix it? By the way, I have ".show-details" set to display: none by default in the CSS file. <script> $(document).ready(function() { $(".product-small").hover(function() { $(this).find('.show-details').fadeIn("fast").css({ display: 'block'}); }, function(){ $(this).find('.show-details').fadeOut("fast").css({ display: 'block'}); }); }); </script>
  14. Hi, I'm currently stuck as two how I can do this, I have a desktop and mobile design where on Desktop the design acts like tabs but on mobile it acts as an Accordion. But i'm not too sure how the best way to go about this is. Please see attached the designs. Any examples or advice on how to do this would be greatly appreciated.
  15. A website user was telling me that text wasn't appearing on bold when the CSS called for font-weight:bold. She's using a Mac desktop, with Safari (and possibly Chrome; I don't have all info yet). The font is Raleway: <link href="https://fonts.googleapis.com/css?family=Raleway" rel="stylesheet" type="text/css"> From what I was able to find -- no one on Google seemed to have this exact issue -- sometimes Safari won't show bold unless you specifically reference a font for it? Is that right? So the solution seems to be changing the stylesheet reference to: <link href="https://fonts.googleapis.com/css?family=Raleway:400,700" rel="stylesheet" type="text/css"> This just seems incredibly odd to me. I've never heard of a user having this issue before. Is this known? Is that the actual fix? Am I to assume all browsers on Chromebook (my preferred platform) and Linux and Windows just create an ad-hoc "faux bold" to display, if bold isn't specified? A lot of questions, but this is just a weird issue, especially since I haven't heard of it until June 2016.
  16. Hello there, my name is Ryan. I am a Web Developer from England that specialises in creating mobile-responsive websites. Whether you need a website that takes monthly payments, one-off purchases or runs ads I will take your idea and craft an elegant solution. Skills - PHP HTML5 CSS Javascript I have built user-interfaces and backend database systems, in my 10 years of web development there is little I haven't touched upon. If you are interested in my services you can contact me at: Email ryansocratous@gmail.com Skype ryanify Thank you.
  17. I can't figure out how to make this script (twitch(dot)tv) to show only online/live channels not all... Here is Javascript (function () { 'use strict'; angular .module('twitch', []) .controller('TwitchCtrl', TwitchCtrl); function TwitchCtrl($http, $scope) { $scope.streams=[]; var apiEndPoint = 'https://api.twitch.tv/kraken/streams/'; var streamers = ['Chizijs','tornis', 'elveeftw', 'piecits', 'lobosjr', 'fattypillow']; var apiSuccess = function(response, streamer){ console.log(response); var stream = response.data; stream.Name = streamer; var offline = stream.stream === null if(offline){ stream.stream = {game: 'offlines', channel:{ 'logo': '' }}; $scope.streams.push(stream); } else{ $scope.streams.unshift(stream); } console.log(stream); }; var apiError = function(response, streamer){ console.log(response); if(response.status === 422){ var stream = response.data; stream.Name = streamer; stream.stream = {game: 'Account Closed', channel:{ 'logo': ''}}; console.log(stream); $scope.streams.push(stream); } }; var setupSuccess = function(streamer){ return function(response){ return apiSuccess(response, streamer); }; }; var setupError = function(streamer){ return function(response){ return apiError(response, streamer); }; }; for(var i = 0; i < streamers.length; i++){ var onSuccess = setupSuccess(streamers[i]); var onError = setupError(streamers[i]); $http({url: apiEndPoint + streamers[i], method:'GET'}) .then(onSuccess, onError); } } })();
  18. I have 3 price tables on my page. These tables under 720px width resolution should get one under the other one (i use bootstrap). The problem is that in any browsers they align well but on desktop safari, ios safari, ios firefox, ios chorome the tables not aligning well at all. You can take a look HERE on safari under 720px resolution to see how it looks. I don't manage to see what is causing the problem.
  19. Is it possible to have a horizontal masonry effect? I know usually masonry is done in columns with posts shown in order vertically. However I want it to be done horizontally. I also want it to be CSS only - no JavaScript whatsoever. Is this possible? Have tried loads of things like displaying as flex, CSS columns, floating, inline-blocks and whatever.
  20. I want to have a list that has pictures on either side of each li. As the li gets bigger (more content), the images should stay in the middle of the li. I've tried numerous divs, before and after classes and gone a bit mad. Any ideas please?
  21. We've got a responsive menu that when you click on an li the ul inside it is then displayed as a block (displayed as none beforehand). However you cannot then close the ul without refreshing the page or closing the menu itself. What we want is for when you click the li again, the ul inside it then displays as none. Is this possible using only CSS? (No jQuery please!!!) Any help is greatly appreciated, thanks!
  22. Hello The Internet is full with Responsive design tutorials, but a could not find any helpful adaptive design tutorial, so if someone know how to create a adaptive design or a useful tutorial please help. Have a Good Day !
  23. Hi everyone, I usually write PHP, but this time, I need a help in CSS. I am trying to create a vertical text, Not transfer rotate degree. I want to write like this: C L A S S Thanks, Gary
  24. Hello, I have this small html and php files and the problem is I can't send any emails... When I press submit it just opens php file on the browser. Can anyone help me? Here is the code <html> <link href="style.css" rel="stylesheet" type="text/css"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8"> <title>Contact Form</title> </head> <body> <header class="body"> </header> <section class="body"> <form method="post" action="mail.php"> <label>Name</label> <input name="name" placeholder="Type Here"> <label>Email</label> <input name="email" type="email" placeholder="Type Here"> <label>Message</label> <textarea name="message" placeholder="Type Here"></textarea> <label>*What is 2+2? (Anti-spam)</label> <input name="human" placeholder="Type Here"> <input id="submit" name="submit" type="submit" value="Submit"> </form> </section> <footer class="body"> </footer> </body> </html> <?php $name = $_POST['name']; $email = $_POST['email']; $message = $_POST['message']; $from = 'From: TangledDemo'; $to = 'myemail@gmail.com'; $subject = 'Hello'; $human = $_POST['human']; $body = "From: $name\n E-Mail: $email\n Message:\n $message"; if ($_POST['submit']) { if ($name != '' && $email != '') { if ($human == '4') { if (mail ($to, $subject, $body, $from)) { echo '<p>Your message has been sent!</p>'; } else { echo '<p>Something went wrong, go back and try again!</p>'; } } else if ($_POST['submit'] && $human != '4') { echo '<p>You answered the anti-spam question incorrectly!</p>'; } } else { echo '<p>You need to fill in all required fields!!</p>'; } } ?>
×
×
  • Create New...

Important Information

We have placed cookies on your device to help make this website better. You can adjust your cookie settings, otherwise we'll assume you're okay to continue.