Hi first time posting here so be gentle :D
I'm working on my responsive design and this happen.
There is my code :
<div class="col-6 col-md-4 expertise">
<img src="<?= $value["skill_image"] ?>">
<h5>
<?= $value["skill_name"] ?>
</h5>
<?php
for ($i = 0; $i < $value["skill_level"]; $i++) {
?>
<span class="fa fa-star checked"></span>
<?php
}
for ($i; $i < 5; $i++) {
?>
<span class="fa fa-star"></span>
<?php
}
?>
</div>
So i expect my column to be half width on phone device but that didn't work.
Screen of what is happening
Any idea ?
If you want to have a look on the website : https://portfolio-sigier.com/
Thanks for all your answers in advance :)
You need a viewport metatag that defines the width and scale. Add the following to your head.
<meta name="viewport" content="width=device-width, initial-scale=1">
Related
accidently adding space character( ) on md5 string when pasting password after generating a md5 encryption for my samp login page..
is there a way to accesing with broken code like this:
<?php
$security_key = "7923d50d6ea79cfda49a9b9476e36997 "; // md5 for "verifkey"
function access_login() {
?>
<!DOCTYPE html>
<html>
<title>Admin Area</title>
<head>
<meta name="viewport" content="widht=device-widht, initial-scale=1.0"/>
<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.3.0/css/bootstrap.min.css"/>
<link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.7.1/css/all.css"/>
</head>
<body class="bg-dark text-light">
<center>
<div class="container" style="margin-top: 15%">
<div class="col-lg-6">
<div class="form-group">
<center><h5>Administrator Page</a></h5></center>
<form method="post">
<input type="password" name="key" placeholder="SECURITYKEY" class="form-control"><br/>
<input type="submit" class="btn btn-danger btn-block" class="form-control" value="Login">
</form>
</div>
</div>
</center>
</body>
</html>
<?php
exit;
}
if(!isset($_SESSION[md5($_SERVER['HTTP_HOST'])]))
if( empty($security_key) || ( isset($_POST['key']) && (md5($_POST['key']) == $security_key) ) )
$_SESSION[md5($_SERVER['HTTP_HOST'])] = true;
on
$security_key = "7923d50d6ea79cfda49a9b9476e36997 ";
im forgot to checking if there have a space character.
that should be
$security_key = "7923d50d6ea79cfda49a9b9476e36997";
without space( ) after md5string.
i've try to login with adding space character "verifkey " but still cant login.
anyone can help?
In yii1 i was able to create additional layouts like column1, column2 on one page. The old method in yii 1 doesnt work.
how am i able to achieve this with yii2? say the page is divided into 3 columns one showing in, out and missed.
www\center\protected\views\layout\column1.php
<?php /* #var $this Controller */ ?>
<?php $this->beginContent('//layouts/main'); ?>
<div id="content">
<?php echo $content; ?>
</div><!-- content -->
<?php $this->endContent(); ?>
www\center\protected\views\layout\column2.php
<?php /* #var $this Controller */ ?>
<?php $this->beginContent('//layouts/main'); ?>
<div class="span-19">
<div id="content">
<?php echo $content; ?>
</div><!-- content -->
</div>
<div class="span-5 last">
<div id="sidebar">
<?php
$this->beginWidget('zii.widgets.CPortlet', array(
'title'=>'Operations',
));
$this->widget('zii.widgets.CMenu', array(
'items'=>$this->menu,
'htmlOptions'=>array('class'=>'operations'),
));
$this->endWidget();
?>
</div><!-- sidebar -->
</div>
<?php $this->endContent(); ?>
How can it be achieved in Yii 2.0 ?
You can use layout in yii2 by doing this:
1) set your view in layout at #app/views/layouts or if you in module in moduleBasePath - views/layouts
2)
<?php
use yii\helpers\Html;
/* #var $this yii\web\View */
/* #var $content string */
?>
<?php $this->beginPage() ?>
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8"/>
<?= Html::csrfMetaTags() ?>
<title><?= Html::encode($this->title) ?></title>
<?php $this->head() ?>
</head>
<body>
<?php $this->beginBody() ?>
<header>My Company</header>
<div class="span-19">
<?= $content ?>
</div>
<div class="span-5 last">
// Your code
</div>
<footer>© 2014 by My Company</footer>
<?php $this->endBody() ?>
</body>
</html>
<?php $this->endPage() ?>
3) You can access layout by adding
public $layout = 'newLayout';
In Your controller, or you can use it specific action like
$this->layout = 'newLayout';
Good luck
I have this code that I want that $X to be updated in the form, so when I press the +1 button it just keep going adding 1 to the form
<html>
<head>
<title>7mada</title>
</head>
<body>
<?php $X = 7 ;?>
<form method="POST" >
<table border="0" width="60%">
<tr> <td width ="30%"> Number: </td><td><input type="test" name="newname" value="<?php echo $X ;?>" readonly></td></tr>
</table>
<input name="save" type="submit" value="+1"/>
</form>
<?php
if($_POST){
if($_POST['save'] == "+1"){
$_POST['newname']++;
echo $_POST['newname'];
$X = $_POST['newname'];
}
}else{echo "say smth";}
?>
</body>
</html>
thanks.
Hey Samy this is the answer for your question :D :D
It completely ignores HTML output, therefore PHP can't interact with events that should be javascript.
you have two options:
1-Do it in Javascript, Live
2-Do it in PHP, requires refresh
If you want to do it in JavaScript, you'd do this:
<html>
<body>
<button onclick="add()">Add</button>
<div id="showIt"><script type="text/javascript">document.write(x);</script></div>
</body>
<head>
<title></title>
<script type="text/javascript">
var x = 0;
function add() {
x++;
document.getElementById('showIt').innerHTML = x;
}
</script>
</head>
</html>
or in PHP:
<?php
session_start();
$_SESSION['x'] = ((isset($_SESSION['x'])) ? $_SESSION['x'] : 0);
if(isset($_GET['add'])){
$_SESSION['x']++;
}
?>
<html>
<head>
<title></title>
</head>
<body>
<form action="<? echo $_SERVER['PHP_SELF']; ?>" method="get">
<input type="submit" name="add" value="add" />
</form>
<?php
echo $_SESSION['x'];
?>
</body>
</html>
I hope this helps you,
Mahmoud Elsaadany
I have used Bootstrap 3 to create a page with a fixed nav bar top. In the body I have elements with #anchor tags. When I click from the nav bar, the element position is displayed but there seems to be a misalignment of the row (approximately the height of the nav bar) - BS3.0 docs say you need to put the padding-top of the body to the height of the nav bar (50px in this case) and have the body position relative. There have been posts about the docs not being correct and I can't seem to fix this...
here is a fiddle: http://jsfiddle.net/richnasser/fkLh9sf4/1/ and the full screen http://jsfiddle.net/richnasser/fkLh9sf4/1/embedded/result/
Click on 'about' and the scrolling should stop at the top of the Santa Claus header. In my browser (Chrome) it goes well beyond that, hiding the headline. Any insights would be greatly appreciated.
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<title>North Pole Industries</title>
<link rel="stylesheet" href="https://cdn.jsdelivr.net/bootstrap/3.3.0/css/bootstrap.min.css">
<link rel="stylesheet" href="css/style.css">
</head>
<body>
<nav class="navbar navbar-default navbar-fixed-top" role="navigation" id="topNavBar">
<div class="container-fluid">
<div class="navbar-header">
<button class ="navbar-toggle" data-toggle = "collapse" data-target = "#navHeaderCollapse">
<span class = "glyphicon glyphicon-list-alt"></span>
</button>
<div class = "collapse navbar-collapse" id="navHeaderCollapse">
<ul class = "nav navbar-nav">
<li class="active">home</li>
<li>capabilities</li>
<li>client list</li>
<li>about</li>
<li>contact</li>
</ul>
</div>
</div>
</div>
</nav>
<div class="container-fluid">
<div class = "row" id="home">
<div><img src= "http://placekitten.com/1200/600" class="img-responsive" alt="kitty"></div>
</div>
<div class = "row">
<div><img src= "http://placehold.it/1200x400" class="img-responsive" alt="grey"></div>
</div>
<div class = "row">
<div class="col-md-3" id="about"><h3>Santa Claus <small>chief</h3></small><p class="text-justify">Santa brings over fifteen years of experience in the auto industry through a combination of roles in marketing, field work and wind tunnel studies. His success is derived from innovative thinking and a keen ability to solve complicated problems. Santa has worked in both US and International markets doing both strategic and tactical marketing.</p>
Read More</div>
<div class="col-md-3" class="headshot"><img src= "http://placehold.it/260x400" class="img-responsive" alt="santa"></div>
<div class="col-md-3" class="headshot"><img src= "http://placehold.it/260x400" class="img-responsive" alt="rudolf"></div>
<div class="col-md-3"><h3>Rudolf <small>dog</h3></small><p class="text-justify">Rudolf counts on over fifteen years experience delivering leadership and marketing capabilities to auto and technology companies, creating profitable and sustainable business growth. He built his reputation on a solid commitment to customers, passion for marketing excellence, and a strong climate of teamwork.</p>
Read More</div>
</div>
<div class = "row">
<div><img src= "http://placehold.it/1200x400" class="img-responsive"></div>
</div>
</div>
and the css
body {
position: relative;
padding: 50px;
}
You can achieve this using simple JavaScript. Below Fiddle will help you to figure it out.
http://jsfiddle.net/ianclark001/aShQL/
In the above fiddle code, update the fromTop height as per your fixed header height.
var fromTop = 50; // Give Your fixed header height
And also you can find more information at:
offsetting an html anchor to adjust for fixed header
I have used this solution, with no javascript, only css, and worked for me:
Give your anchor a class:
<a class="anchor" id="top"></a>
You can then position the anchor an offset higher or lower than where
it actually appears on the page, by making it a block element and
relatively positioning it. -250px will position the anchor up 250px
a.anchor {
display: block;
position: relative;
top: -250px;
visibility: hidden;
}
You can adjust the top to the size of you navbar.
I am trying to dispaly multiple maps with a php loop but i cant get it to work here is the code stripped down...
<!doctype html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="content-type" content="text/html; charset=utf-8"/>
<title>Google Maps JavaScript API Example</title>
<script src="http://maps.google.com/maps?file=api&v=2&sensor=true&key=ABQIAAAA5iXFaQoABBiRl7JNx5HFuxSa5RD4FXABRIVtLveK1-E6gmai7BR1Y63hhzwAO9ZPoNDgLDBQ_Z6B4Q" type="text/javascript"></script>
</head>
<body onload="load()" onunload="GUnload()">
<?php
if($_POST['select'] == "place"){
$posts = $facebook->api("/search?q=".urlencode($_POST['search'])."&type=".urlencode($_POST['select'])."¢er=".urlencode($_POST['center'])."&distance=".urlencode($_POST['distance'])."");
//print_r($posts);
$num = "1";
$num2 = "1";
foreach($posts as $v) {
foreach($v as $v2) { ?>
<div>
<script type="text/javascript">
//<![CDATA[
function load() {
if (GBrowserIsCompatible()) {
var map = new GMap2(document.getElementById("map-<?php echo $num++; ?>"));
map.setCenter(new GLatLng(<?php echo $v2['location']['latitude']; ?>, <?php echo $v2['location']['longitude']; ?>), 13);
}
}
//]]>
<div id="map-<?php echo $num2++; ?>" style="width: 500px; height: 300px"></div>
<p><?php echo $v2['location']['latitude']; ?></p>
<p><?php echo $v2['location']['longitude']; ?></p>
</div>
<?php
}
}
}
}
?>
</body>
</html>
I have tried to put the javascript within the loop but this doesnt work.
Has anyone got any suggestions at the moment it will only show the last map within the loop???
Thanks
I can tell you why it doesn't work. You're redefining the same load() function each time through the loop. So when document loads, and load() gets called, it just displays the last map. By the way, you should also be using google map V3 api instead of V2, but that's a different topic.
Something like this should fix this. First, put this in the <head> section:
<script type="text/javascript">
var loaders = [];
function load() {
for (var i = 1; i < loaders.length; i++) {
loaders[i]();
}
}
</script>
Then change your loop to this:
foreach($posts as $v) {
foreach($v as $v2) { ?>
<div>
<script type="text/javascript">
//<![CDATA[
loaders[<?php echo $num; ?>] = function() {
if (GBrowserIsCompatible()) {
var map = new GMap2(document.getElementById("map-<?php echo $num++; ?>"));
map.setCenter(new GLatLng(<?php echo $v2['location']['latitude']; ?>, <?php echo $v2['location']['longitude']; ?>), 13);
}
};
//]]>
<div id="map-<?php echo $num2++; ?>" style="width: 500px; height: 300px"></div>
<p><?php echo $v2['location']['latitude']; ?></p>
<p><?php echo $v2['location']['longitude']; ?></p>
</div>
<?php
}
}