I am using this to get my Ajax post call to work in a Laravel 5 app:
<meta name="csrf-token" content="<?= csrf_token() ?>">
$.ajaxSetup({
headers: {
'X-CSRF-Token': $('meta[name="csrf-token"]').attr('content')
}
});
request = $.ajax({
url: "/user",
type: "post", success:function(data){
},
data: {'email': email} ,beforeSend: function(data){console.log(data);}
});
I can see the token rendering correctly in the page source, but I still get the Internal Server Error 500 and the Ajax call fails. Any idea what is happening?
EDIT:
Ajax Output:
POST http://vidvalize.dev/user 500 (Internal Server Error)n.ajaxTransport.k.cors.a.crossDomain.send # jquery-2.1.4.min.js:4n.extend.ajax # jquery-2.1.4.min.js:4React.createClass.saveAndContinue # script.js:37u # react.min.js:12_.executeDispatch # react.min.js:16a # react.min.js:12s # react.min.js:12c # react.min.js:12r # react.min.js:16d.processEventQueue # react.min.js:12r # react.min.js:15i.handleTopLevel # react.min.js:15i # react.min.js:15o.perform # react.min.js:16d.batchedUpdates # react.min.js:13i # react.min.js:15v.dispatchEvent # react.min.js:15
Object {readyState: 0}abort: (a){var b=a||u;return c&&c.abort(b),x(0,b),this}always: (){return e.done(arguments).fail(arguments),this}complete: (){if(h){var c=h.length;!function g(b){n.each(b,function(b,c){var d=n.type(c);"function"===d?a.unique&&k.has(c)||h.push(c):c&&c.length&&"string"!==d&&g(c)})}(arguments),d?f=h.length:b&&(e=c,j(b))}return this}done: (){if(h){var c=h.length;!function g(b){n.each(b,function(b,c){var d=n.type(c);"function"===d?a.unique&&k.has(c)||h.push(c):c&&c.length&&"string"!==d&&g(c)})}(arguments),d?f=h.length:b&&(e=c,j(b))}return this}error: (){if(h){var c=h.length;!function g(b){n.each(b,function(b,c){var d=n.type(c);"function"===d?a.unique&&k.has(c)||h.push(c):c&&c.length&&"string"!==d&&g(c)})}(arguments),d?f=h.length:b&&(e=c,j(b))}return this}fail: (){if(h){var c=h.length;!function g(b){n.each(b,function(b,c){var d=n.type(c);"function"===d?a.unique&&k.has(c)||h.push(c):c&&c.length&&"string"!==d&&g(c)})}(arguments),d?f=h.length:b&&(e=c,j(b))}return this}getAllResponseHeaders: (){return 2===t?e:null}getResponseHeader: (a){var b;if(2===t){if(!f){f={};while(b=gb.exec(e))f[b[1].toLowerCase()]=b[2]}b=f[a.toLowerCase()]}return null==b?null:b}overrideMimeType: (a){return t||(k.mimeType=a),this}pipe: (){var a=arguments;return n.Deferred(function(c){n.each(b,function(b,f){var g=n.isFunction(a[b])&&a[b];e[f[1]](function(){var a=g&&g.apply(this,arguments);a&&n.isFunction(a.promise)?a.promise().done(c.resolve).fail(c.reject).progress(c.notify):c[f[0]+"With"](this===d?c.promise():this,g?[a]:arguments)})}),a=null}).promise()}progress: (){if(h){var c=h.length;!function g(b){n.each(b,function(b,c){var d=n.type(c);"function"===d?a.unique&&k.has(c)||h.push(c):c&&c.length&&"string"!==d&&g(c)})}(arguments),d?f=h.length:b&&(e=c,j(b))}return this}promise: (a){return null!=a?n.extend(a,d):d}readyState: 4responseText: "<!DOCTYPE html>↵<html>↵ <head>↵ <meta charset="UTF-8" />↵ <meta name="robots" content="noindex,nofollow" />↵ <style>↵ /* Copyright (c) 2010, Yahoo! Inc. All rights reserved. Code licensed under the BSD License: http://developer.yahoo.com/yui/license.html */↵ html{color:#000;background:#FFF;}body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,code,form,fieldset,legend,input,textarea,p,blockquote,th,td{margin:0;padding:0;}table{border-collapse:collapse;border-spacing:0;}fieldset,img{border:0;}address,caption,cite,code,dfn,em,strong,th,var{font-style:normal;font-weight:normal;}li{list-style:none;}caption,th{text-align:left;}h1,h2,h3,h4,h5,h6{font-size:100%;font-weight:normal;}q:before,q:after{content:'';}abbr,acronym{border:0;font-variant:normal;}sup{vertical-align:text-top;}sub{vertical-align:text-bottom;}input,textarea,select{font-family:inherit;font-size:inherit;font-weight:inherit;}input,textarea,select{*font-size:100%;}legend{color:#000;}↵↵ html { background: #eee; padding: 10px }↵ img { border: 0; }↵ #sf-resetcontent { width:970px; margin:0 auto; }↵ .sf-reset { font: 11px Verdana, Arial, sans-serif; color: #333 }↵ .sf-reset .clear { clear:both; height:0; font-size:0; line-height:0; }↵ .sf-reset .clear_fix:after { display:block; height:0; clear:both; visibility:hidden; }↵ .sf-reset .clear_fix { display:inline-block; }↵ .sf-reset * html .clear_fix { height:1%; }↵ .sf-reset .clear_fix { display:block; }↵ .sf-reset, .sf-reset .block { margin: auto }↵ .sf-reset abbr { border-bottom: 1px dotted #000; cursor: help; }↵ .sf-reset p { font-size:14px; line-height:20px; color:#868686; padding-bottom:20px }↵ .sf-reset strong { font-weight:bold; }↵ .sf-reset a { color:#6c6159; cursor: default; }↵ .sf-reset a img { border:none; }↵ .sf-reset a:hover { text-decoration:underline; }↵ .sf-reset em { font-style:italic; }↵ .sf-reset h1, .sf-reset h2 { font: 20px Georgia, "Times New Roman", Times, serif }↵ .sf-reset .exception_counter { background-color: #fff; color: #333; padding: 6px; float: left; margin-right: 10px; float: left; display: block; }↵ .sf-reset .exception_title { margin-left: 3em; margin-bottom: 0.7em; display: block; }↵ .sf-reset .exception_message { margin-left: 3em; display: block; }↵ .sf-reset .traces li { font-size:12px; padding: 2px 4px; list-style-type:decimal; margin-left:20px; }↵ .sf-reset .block { background-color:#FFFFFF; padding:10px 28px; margin-bottom:20px;↵ -webkit-border-bottom-right-radius: 16px;↵ -webkit-border-bottom-left-radius: 16px;↵ -moz-border-radius-bottomright: 16px;↵ -moz-border-radius-bottomleft: 16px;↵ border-bottom-right-radius: 16px;↵ border-bottom-left-radius: 16px;↵ border-bottom:1px solid #ccc;↵ border-right:1px solid #ccc;↵ border-left:1px solid #ccc;↵ }↵ .sf-reset .block_exception { background-color:#ddd; color: #333; padding:20px;↵ -webkit-border-top-left-radius: 16px;↵ -webkit-border-top-right-radius: 16px;↵ -moz-border-radius-topleft: 16px;↵ -moz-border-radius-topright: 16px;↵ border-top-left-radius: 16px;↵ border-top-right-radius: 16px;↵ border-top:1px solid #ccc;↵ border-right:1px solid #ccc;↵ border-left:1px solid #ccc;↵ overflow: hidden;↵ word-wrap: break-word;↵ }↵ .sf-reset a { background:none; color:#868686; text-decoration:none; }↵ .sf-reset a:hover { background:none; color:#313131; text-decoration:underline; }↵ .sf-reset ol { padding: 10px 0; }↵ .sf-reset h1 { background-color:#FFFFFF; padding: 15px 28px; margin-bottom: 20px;↵ -webkit-border-radius: 10px;↵ -moz-border-radius: 10px;↵ border-radius: 10px;↵ border: 1px solid #ccc;↵ }↵ </style>↵ </head>↵ <body>↵ <div id="sf-resetcontent" class="sf-reset">↵ <h1>Whoops, looks like something went wrong.</h1>↵ <h2 class="block_exception clear_fix">↵ <span class="exception_counter">1/1</span>↵ <span class="exception_title"><abbr title="Symfony\Component\Debug\Exception\FatalErrorException">FatalErrorException</abbr> in <a title="/home/vagrant/code/vidvalize/app/Http/Controllers/UserController.php line 5" ondblclick="var f=this.innerHTML;this.innerHTML=this.title;this.title=f;">UserController.php line 5</a>:</span>↵ <sp…>Illuminate\Pipeline\{closure}() in <a title="/home/vagrant/code/vidvalize/vendor/laravel/framework/src/Illuminate/Cookie/Middleware/AddQueuedCookiesToResponse.php line 37" ondblclick="var f=this.innerHTML;this.innerHTML=this.title;this.title=f;">AddQueuedCookiesToResponse.php line 37</a></li>↵ <li>at <abbr title="Illuminate\Cookie\Middleware\AddQueuedCookiesToResponse">AddQueuedCookiesToResponse</abbr>->handle() in <a title="/home/vagrant/code/vidvalize/vendor/laravel/framework/src/Illuminate/Pipeline/Pipeline.php line 124" ondblclick="var f=this.innerHTML;this.innerHTML=this.title;this.title=f;">Pipeline.php line 124</a></li>↵ <li>at <abbr title=""></abbr>call_user_func_array:{/home/vagrant/code/vidvalize/vendor/laravel/framework/src/Illuminate/Pipeline/Pipeline.php:124}() in <a title="/home/vagrant/code/vidvalize/vendor/laravel/framework/src/Illuminate/Pipeline/Pipeline.php line 124" ondblclick="var f=this.innerHTML;this.innerHTML=this.title;this.title=f;">Pipeline.php line 124</a></li>↵ <li>at <abbr title="Illuminate\Pipeline\Pipeline">Pipeline</abbr>->Illuminate\Pipeline\{closure}() in <a title="/home/vagrant/code/vidvalize/vendor/laravel/framework/src/Illuminate/Cookie/Middleware/EncryptCookies.php line 59" ondblclick="var f=this.innerHTML;this.innerHTML=this.title;this.title=f;">EncryptCookies.php line 59</a></li>↵ <li>at <abbr title="Illuminate\Cookie\Middleware\EncryptCookies">EncryptCookies</abbr>->handle() in <a title="/home/vagrant/code/vidvalize/vendor/laravel/framework/src/Illuminate/Pipeline/Pipeline.php line 124" ondblclick="var f=this.innerHTML;this.innerHTML=this.title;this.title=f;">Pipeline.php line 124</a></li>↵ <li>at <abbr title=""></abbr>call_user_func_array:{/home/vagrant/code/vidvalize/vendor/laravel/framework/src/Illuminate/Pipeline/Pipeline.php:124}() in <a title="/home/vagrant/code/vidvalize/vendor/laravel/framework/src/Illuminate/Pipeline/Pipeline.php line 124" ondblclick="var f=this.innerHTML;this.innerHTML=this.title;this.title=f;">Pipeline.php line 124</a></li>↵ <li>at <abbr title="Illuminate\Pipeline\Pipeline">Pipeline</abbr>->Illuminate\Pipeline\{closure}() in <a title="/home/vagrant/code/vidvalize/vendor/laravel/framework/src/Illuminate/Foundation/Http/Middleware/CheckForMaintenanceMode.php line 42" ondblclick="var f=this.innerHTML;this.innerHTML=this.title;this.title=f;">CheckForMaintenanceMode.php line 42</a></li>↵ <li>at <abbr title="Illuminate\Foundation\Http\Middleware\CheckForMaintenanceMode">CheckForMaintenanceMode</abbr>->handle() in <a title="/home/vagrant/code/vidvalize/vendor/laravel/framework/src/Illuminate/Pipeline/Pipeline.php line 124" ondblclick="var f=this.innerHTML;this.innerHTML=this.title;this.title=f;">Pipeline.php line 124</a></li>↵ <li>at <abbr title=""></abbr>call_user_func_array:{/home/vagrant/code/vidvalize/vendor/laravel/framework/src/Illuminate/Pipeline/Pipeline.php:124}() in <a title="/home/vagrant/code/vidvalize/vendor/laravel/framework/src/Illuminate/Pipeline/Pipeline.php line 124" ondblclick="var f=this.innerHTML;this.innerHTML=this.title;this.title=f;">Pipeline.php line 124</a></li>↵ <li>at <abbr title="Illuminate\Pipeline\Pipeline">Pipeline</abbr>->Illuminate\Pipeline\{closure}() in <a title="/home/vagrant/code/vidvalize/vendor/laravel/framework/src/Illuminate/Pipeline/Pipeline.php line 103" ondblclick="var f=this.innerHTML;this.innerHTML=this.title;this.title=f;">Pipeline.php line 103</a></li>↵ <li>at <abbr title=""></abbr>call_user_func:{/home/vagrant/code/vidvalize/vendor/laravel/framework/src/Illuminate/Pipeline/Pipeline.php:103}() in <a title="/home/vagrant/code/vidvalize/vendor/laravel/framework/src/Illuminate/Pipeline/Pipeline.php line 103" ondblclick="var f=this.innerHTML;this.innerHTML=this.title;this.title=f;">Pipeline.php line 103</a></li>↵ <li>at <abbr title="Illuminate\Pipeline\Pipeline">Pipeline</abbr>->then() in <a title="/home/vagrant/code/vidvalize/vendor/laravel/framework/src/Illuminate/Foundation/Http/Kernel.php line 118" ondblclick="var f=this.innerHTML;this.innerHTML=this.title;this.title=f;">Kernel.php line 118</a></li>↵ <li>at <abbr title="Illuminate\Foundation\Http\Kernel">Kernel</abbr>->sendRequestThroughRouter() in <a title="/home/vagrant/code/vidvalize/vendor/laravel/framework/src/Illuminate/Foundation/Http/Kernel.php line 86" ondblclick="var f=this.innerHTML;this.innerHTML=this.title;this.title=f;">Kernel.php line 86</a></li>↵ <li>at <abbr title="Illuminate\Foundation\Http\Kernel">Kernel</abbr>->handle() in <a title="/home/vagrant/code/vidvalize/public/index.php line 54" ondblclick="var f=this.innerHTML;this.innerHTML=this.title;this.title=f;">index.php line 54</a></li>↵ <li>at <abbr title=""></abbr>{main}() in <a title="/home/vagrant/code/vidvalize/public/index.php line 0" ondblclick="var f=this.innerHTML;this.innerHTML=this.title;this.title=f;">index.php line 0</a></li>↵ </ol>↵</div>↵↵ </div>↵ </body>↵</html>"setRequestHeader: (a,b){var c=a.toLowerCase();return t||(a=s[c]=s[c]||a,r[a]=b),this}state: (){return c}status: 500statusCode: (a){var b;if(a)if(2>t)for(b in a)q[b]=[q[b],a[b]];else v.always(a[v.status]);return this}statusText: "Internal Server Error"success: (){if(h){var c=h.length;!function g(b){n.each(b,function(b,c){var d=n.type(c);"function"===d?a.unique&&k.has(c)||h.push(c):c&&c.length&&"string"!==d&&g(c)})}(arguments),d?f=h.length:b&&(e=c,j(b))}return this}then: (){var a=arguments;return n.Deferred(function(c){n.each(b,function(b,f){var g=n.isFunction(a[b])&&a[b];e[f[1]](function(){var a=g&&g.apply(this,arguments);a&&n.isFunction(a.promise)?a.promise().done(c.resolve).fail(c.reject).progress(c.notify):c[f[0]+"With"](this===d?c.promise():this,g?[a]:arguments)})}),a=null}).promise()}__proto__: Object
There can be many reasons for internal server error. It would be helpful to narrow down the problem, if you can post entire ajax response.
But if you think, it has to do with csrf_token try sending it as a request data like below,
request = $.ajax({
url: "/user",
type: "post",
data: 'email=' + email + '&_token={{ csrf_token() }}',
beforeSend: function(data){console.log(data);},
success:function(data){}
});
Are there POST parameters you need to be sending?
Related
I have created simple conversion form that takes input from user and calculate the result without pressing button. My problem is that it works fine on localhost but when I upload it on free hosting site it doesn't respond with calculations. JQuery also doesn't work when I press the div on the top left of my form it highlights on local but not when I upload Please help.
Here is my index.html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
<script src="http://code.jquery.com/jquery-1.11.1.min.js"></script>
</head>
<!-- <script type="text/javascript">
$("document").ready(function(e){
$("input").change(function(){
var total=0;
$("input[name=qww]").each (function(){
total=10*parseInt($(this).val());
})
$("input[name=long]").val(total);
});
});
</script> -->
<style type="text/css">
.main{
height:400px;
width: 300px;
background-color: white;
margin: 100px 100px 100px 100px;
border-radius: 10px;
}
#compare{
height: 50px;
width: 147px;
background-color: white;
border-right-style: solid;
border-right-color: orange;
float: left;
}
#compare2{
height: 50px;
width: 150px;
background-color: white ;
float: right;
}
#compare4{
height: 35px;
width: 147px;
background-color: white;
border-right-style: solid;
border-right-color: orange;
float: left;
}
#compare5{
height: 35px;
width: 150px;
background-color: white ;
float: right;
}
.form{
height: 150px;
width: 300px;
background-color: white;
float: left;
margin-top: 10px;
margin-bottom: 10px;
}
.Myform{
padding: 5px 0;
}
input[type=text]{
width: 70px;
height: 30px;
font-style: oblique;
font-size: 18px;
outline: none;
border: none;
font-weight:bolder;
}
.qwerty{
height: 20px;
width: 300px;
background-color: rgb(122, 16, 122);
color: blue;
}
.button{
margin-top: 20px;
margin-left: 0px;
width: 300px;
height: 40px;
background-color: blue;
color: white;
font-size: 18px;
text-align: center;
border-radius: 10px;
-WEbkit-box-shadow: 3px 3px 3px #ccc;
font-family: Cambria, Cochin, Georgia, Times, 'Times New Roman', serif;
}
.text{
margin-top: 5px;
background-color: rgb(255, 255, 255);
height: 60px;
border-radius: 5px;
-WEbkit-box-shadow: 3px 3px 3px #ccc;
}
.initial{
height: 15px;
margin-top: 50px;
width: 147px;
background-color: white;
border-right-style: solid;
border-right-color: orange;
}
.image{
width: 40px;
height: 15px;
margin-left: 10px;
}
img{
vertical-align: top;
}
.highLight{
background-color: #333333;
}
.panel{
-webkit-transition:0.3s;
transition:0.3s;
opacity:1;
}
.panel:not(.highLight){
opacity:0.5;
}
</style>
<body>
<div class="main">
<div class="initial" style="float: left; font-size: 10px; text-align: center; color: blue;" >
COMPARE</div>
<div class="initial" style="float: right;font-size: 10px; text-align: center; color: blue;">
VENTA</div>
<div class="panel" id="compare"style="font-size: 26px;font-weight: bolder; text-align: center;color: black;">3.4000
</div>
<div class="panel" id="compare2"style="font-size: 26px;font-weight: bolder; text-align: center;color: black;">3.4306
</div>
<div class="form">
<div class="text">
<div class="QWERTY" style="font-size: 10px; text-align: right;color: blue;">
VENTA</div>
<form id="bbb" action="index.html" class="Myform" style="font-size: 10px; font-weight: bold;">USD
<label for="" style="font-size: 30px;"> $</label>
<input type="text" class='qww' placeholder="1000" style="float: right;">
</form>
</div>
<div class="image">
<a href="www.google.com"><img src="images.jpg" alt="" style="margin-left: 50px; width: 40px;object-position:right; height: 45px;">
</a>
</div>
<div class="text" >
<div class="QWERTY" style="font-size: 10px; text-align: right; color: blue;">
VENTA</div>
<form action="index.html" class="Myform" style="font-size: 10px;">PEN
<label for="" style="font-size: 30px; font-weight: bold;"> S/</label>
<input type="text" id='long' placeholder="3400" style="float: right;" disabled>
</form>
<button class="button" value="compare"> </button>
</div>
</div>
<div class="initial" style="float: left; font-size: 10px; text-align: center;" >
</div>
<div class="initial" style="float: right;font-size: 10px; text-align: center;">
VENTA</div>
<div id="compare4"style="font-size: 30px;font-weight: bolder; text-align: right;color: blue;">
</div>
<div id="compare5"style="font-size:12px; text-align: center;color: black;">
<h4> S/ 54.70</h4>
</div>
</div>
<script>
// we used jQuery 'keyup' to trigger the computation as the user type
$('.qww').keyup(function () {
// initialize the sum (total price) to zero
var sum = 0;
// we use jQuery each() to loop through all the textbox with 'price' class
// and compute the sum for each loop
$('.qww').each(function() {
sum =10* Number($(this).val());
});
// set the computed value to 'totalPrice' textbox
$('#long').val(sum);
});
$('.panel').hover(function(){
$(this).toggleClass('highLight');
});
</script>
</body>
</html>
An error occurred after "Adding Image" or "Drag and Drop" an image. Also, it's not uploaded into the destination folder.
Upload Error Code:
<html> <head> <meta charset="UTF-8"/> <meta name="robots" content="noindex,nofollow"/> <style> /* Copyright (c) 2010, Yahoo! Inc. All rights reserved. Code licensed under the BSD License: http://developer.yahoo.com/yui... */ html{color:#000;background:#FFF;}body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,code,form,fieldset,legend,input,textarea,p,blockquote,th,td{margin:0;padding:0;}table{border-collapse:collapse;border-spacing:0;}fieldset,img{border:0;}address,caption,cite,code,dfn,em,strong,th,var{font-style:normal;font-weight:normal;}li{list-style:none;}caption,th{text-align:left;}h1,h2,h3,h4,h5,h6{font-size:100%;font-weight:normal;}q:before,q:after{content:'';}abbr,acronym{border:0;font-variant:normal;}sup{vertical-align:text-top;}sub{vertical-align:text-bottom;}input,textarea,select{font-family:inherit;font-size:inherit;font-weight:inherit;}input,textarea,select{*font-size:100%;}legend{color:#000;} html { background: #eee; padding: 10px } img { border: 0; } #sf-resetcontent { width:970px; margin:0 auto; } .sf-reset { font: 11px Verdana, Arial, sans-serif; color: #333 } .sf-reset .clear { clear:both; height:0; font-size:0; line-height:0; } .sf-reset .clear_fix:after { display:block; height:0; clear:both; visibility:hidden; } .sf-reset .clear_fix { display:inline-block; } .sf-reset * html .clear_fix { height:1%; } .sf-reset .clear_fix { display:block; } .sf-reset, .sf-reset .block { margin: auto } .sf-reset abbr { border-bottom: 1px dotted #000; cursor: help; } .sf-reset p { font-size:14px; line-height:20px; color:#868686; padding-bottom:20px } .sf-reset strong { font-weight:bold; } .sf-reset a { color:#6c6159; cursor: default; } .sf-reset a img { border:none; } .sf-reset a:hover { text-decoration:underline; } .sf-reset em { font-style:italic; } .sf-reset h1, .sf-reset h2 { font: 20px Georgia, "Times New Roman", Times, serif } .sf-reset .exception_counter { background-color: #fff; color: #333; padding: 6px; float: left; margin-right: 10px; float: left; display: block; } .sf-reset .exception_title { margin-left: 3em; margin-bottom: 0.7em; display: block; } .sf-reset .exception_message { margin-left: 3em; display: block; } .sf-reset .traces li { font-size:12px; padding: 2px 4px; list-style-type:decimal; margin-left:20px; } .sf-reset .block { background-color:#FFFFFF; padding:10px 28px; margin-bottom:20px; -webkit-border-bottom-right-radius: 16px; -webkit-border-bottom-left-radius: 16px; -moz-border-radius-bottomright: 16px; -moz-border-radius-bottomleft: 16px; border-bottom-right-radius: 16px; border-bottom-left-radius: 16px; border-bottom:1px solid #ccc; border-right:1px solid #ccc; border-left:1px solid #ccc; word-wrap: break-word; } .sf-reset .block_exception { background-color:#ddd; color: #333; padding:20px; -webkit-border-top-left-radius: 16px; -webkit-border-top-right-radius: 16px; -moz-border-radius-topleft: 16px; -moz-border-radius-topright: 16px; border-top-left-radius: 16px; border-top-right-radius: 16px; border-top:1px solid #ccc; border-right:1px solid #ccc; border-left:1px solid #ccc; overflow: hidden; word-wrap: break-word; } .sf-reset a { background:none; color:#868686; text-decoration:none; } .sf-reset a:hover { background:none; color:#313131; text-decoration:underline; } .sf-reset ol { padding: 10px 0; } .sf-reset h1 { background-color:#FFFFFF; padding: 15px 28px; margin-bottom: 20px; -webkit-border-radius: 10px; -moz-border-radius: 10px; border-radius: 10px; border: 1px solid #ccc; } </style> </head> <body> <div id="sf-resetcontent" class="sf-reset"> <h1>Whoops, looks like something went wrong.</h1> <h2 class="block_exception clear_fix"> 1/1 <abbr title="Symfony\Component\Debug\Exception\FatalThrowableError">FatalThrowableError</abbr> in ImageRepository.php line 18: Access to undeclared static property: App\Image::$rules </h2> <div class="block"> <ol class="traces list_exception"> <li> in ImageRepository.php line 18</li> <li>at <abbr title="App\Logic\Image\ImageRepository">ImageRepository</abbr>->upload(array('_token' => '0tyWiynSc7MLXoUKIdFsUGRlGEJONb4DmPuTxIBJ', 'file' => object(<abbr title="Illuminate\Http\UploadedFile">UploadedFile</abbr>))) in ImageController.php line 25</li> <li>at <abbr title="App\Http\Controllers\ImageController">ImageController</abbr>->postUpload()</li> <li>at <abbr title=""></abbr>call_user_func_array(array(object(<abbr title="App\Http\Controllers\ImageController">ImageController</abbr>), 'postUpload'), array()) in Controller.php line 55</li> <li>at <abbr title="Illuminate\Routing\Controller">Controller</abbr>->callAction('postUpload', array()) in ControllerDispatcher.php line 44</li> <li>at <abbr title="Illuminate\Routing\ControllerDispatcher">ControllerDispatcher</abbr>->dispatch(object(<abbr title="Illuminate\Routing\Route">Route</abbr>), object(<abbr title="App\Http\Controllers\ImageController">ImageController</abbr>), 'postUpload') in Route.php line 189</li> <li>at <abbr title="Illuminate\Routing\Route">Route</abbr>->runController() in Route.php line 144</li> <li>at <abbr title="Illuminate\Routing\Route">Route</abbr>->run(object(<abbr title="Illuminate\Http\Request">Request</abbr>)) in Router.php line 642</li> <li>at <abbr title="Illuminate\Routing\Router">Router</abbr>->Illuminate\Routing\{closure}(object(<abbr title="Illuminate\Http\Request">Request</abbr>)) in Pipeline.php line 53</li> <li>at <abbr title="Illuminate\Routing\Pipeline">Pipeline</abbr>->Illuminate\Routing\{closure}(object(<abbr title="Illuminate\Http\Request">Request</abbr>)) in SubstituteBindings.php line 41</li> <li>at <abbr title="Illuminate\Routing\Middleware\SubstituteBindings">SubstituteBindings</abbr>->handle(object(<abbr title="Illuminate\Http\Request">Request</abbr>), object(<abbr title="Closure">Closure</abbr>)) in Pipeline.php line 137</li> <li>at <abbr title="Illuminate\Pipeline\Pipeline">Pipeline</abbr>->Illuminate\Pipeline\{closure}(object(<abbr title="Illuminate\Http\Request">Request</abbr>)) in Pipeline.php line 33</li> <li>at <abbr title="Illuminate\Routing\Pipeline">Pipeline</abbr>->Illuminate\Routing\{closure}(object(<abbr title="Illuminate\Http\Request">Request</abbr>)) in VerifyCsrfToken.php line 65</li> <li>at <abbr title="Illuminate\Foundation\Http\Middleware\VerifyCsrfToken">VerifyCsrfToken</abbr>->handle(object(<abbr title="Illuminate\Http\Request">Request</abbr>), object(<abbr title="Closure">Closure</abbr>)) in Pipeline.php line 137</li> <li>at <abbr title="Illuminate\Pipeline\Pipeline">Pipeline</abbr>->Illuminate\Pipeline\{closure}(object(<abbr title="Illuminate\Http\Request">Request</abbr>)) in Pipeline.php line 33</li> <li>at <abbr title="Illuminate\Routing\Pipeline">Pipeline</abbr>->Illuminate\Routing\{closure}(object(<abbr title="Illuminate\Http\Request">Request</abbr>)) in ShareErrorsFromSession.php line 49</li> <li>at <abbr title="Illuminate\View\Middleware\ShareErrorsFromSession">ShareErrorsFromSession</abbr>->handle(object(<abbr title="Illuminate\Http\Request">Request</abbr>), object(<abbr title="Closure">Closure</abbr>)) in Pipeline.php line 137</li> <li>at <abbr title="Illuminate\Pipeline\Pipeline">Pipeline</abbr>->Illuminate\Pipeline\{closure}(object(<abbr title="Illuminate\Http\Request">Request</abbr>)) in Pipeline.php line 33</li> <li>at <abbr title="Illuminate\Routing\Pipeline">Pipeline</abbr>->Illuminate\Routing\{closure}(object(<abbr title="Illuminate\Http\Request">Request</abbr>)) in StartSession.php line 64</li> <li>at <abbr title="Illuminate\Session\Middleware\StartSession">StartSession</abbr>->handle(object(<abbr title="Illuminate\Http\Request">Request</abbr>), object(<abbr title="Closure">Closure</abbr>)) in Pipeline.php line 137</li> <li>at <abbr title="Illuminate\Pipeline\Pipeline">Pipeline</abbr>->Illuminate\Pipeline\{closure}(object(<abbr title="Illuminate\Http\Request">Request</abbr>)) in Pipeline.php line 33</li> <li>at <abbr title="Illuminate\Routing\Pipeline">Pipeline</abbr>->Illuminate\Routing\{closure}(object(<abbr title="Illuminate\Http\Request">Request</abbr>)) in AddQueuedCookiesToResponse.php line 37</li> <li>at <abbr title="Illuminate\Cookie\Middleware\AddQueuedCookiesToResponse">AddQueuedCookiesToResponse</abbr>->handle(object(<abbr title="Illuminate\Http\Request">Request</abbr>), object(<abbr title="Closure">Closure</abbr>)) in Pipeline.php line 137</li> <li>at <abbr title="Illuminate\Pipeline\Pipeline">Pipeline</abbr>->Illuminate\Pipeline\{closure}(object(<abbr title="Illuminate\Http\Request">Request</abbr>)) in Pipeline.php line 33</li> <li>at <abbr title="Illuminate\Routing\Pipeline">Pipeline</abbr>->Illuminate\Routing\{closure}(object(<abbr title="Illuminate\Http\Request">Request</abbr>)) in EncryptCookies.php line 59</li> <li>at <abbr title="Illuminate\Cookie\Middleware\EncryptCookies">EncryptCookies</abbr>->handle(object(<abbr title="Illuminate\Http\Request">Request</abbr>), object(<abbr title="Closure">Closure</abbr>)) in Pipeline.php line 137</li> <li>at <abbr title="Illuminate\Pipeline\Pipeline">Pipeline</abbr>->Illuminate\Pipeline\{closure}(object(<abbr title="Illuminate\Http\Request">Request</abbr>)) in Pipeline.php line 33</li> <li>at <abbr title="Illuminate\Routing\Pipeline">Pipeline</abbr>->Illuminate\Routing\{closure}(object(<abbr title="Illuminate\Http\Request">Request</abbr>)) in Pipeline.php line 104</li> <li>at <abbr title="Illuminate\Pipeline\Pipeline">Pipeline</abbr>->then(object(<abbr title="Closure">Closure</abbr>)) in Router.php line 644</li> <li>at <abbr title="Illuminate\Routing\Router">Router</abbr>->runRouteWithinStack(object(<abbr title="Illuminate\Routing\Route">Route</abbr>), object(<abbr title="Illuminate\Http\Request">Request</abbr>)) in Router.php line 618</li> <li>at <abbr title="Illuminate\Routing\Router">Router</abbr>->dispatchToRoute(object(<abbr title="Illuminate\Http\Request">Request</abbr>)) in Router.php line 596</li> <li>at <abbr title="Illuminate\Routing\Router">Router</abbr>->dispatch(object(<abbr title="Illuminate\Http\Request">Request</abbr>)) in Kernel.php line 268</li> <li>at <abbr title="Illuminate\Foundation\Http\Kernel">Kernel</abbr>->Illuminate\Foundation\Http\{closure}(object(<abbr title="Illuminate\Http\Request">Request</abbr>)) in Pipeline.php line 53</li> <li>at <abbr title="Illuminate\Routing\Pipeline">Pipeline</abbr>->Illuminate\Routing\{closure}(object(<abbr title="Illuminate\Http\Request">Request</abbr>)) in CheckForMaintenanceMode.php line 46</li> <li>at <abbr title="Illuminate\Foundation\Http\Middleware\CheckForMaintenanceMode">CheckForMaintenanceMode</abbr>->handle(object(<abbr title="Illuminate\Http\Request">Request</abbr>), object(<abbr title="Closure">Closure</abbr>)) in Pipeline.php line 137</li> <li>at <abbr title="Illuminate\Pipeline\Pipeline">Pipeline</abbr>->Illuminate\Pipeline\{closure}(object(<abbr title="Illuminate\Http\Request">Request</abbr>)) in Pipeline.php line 33</li> <li>at <abbr title="Illuminate\Routing\Pipeline">Pipeline</abbr>->Illuminate\Routing\{closure}(object(<abbr title="Illuminate\Http\Request">Request</abbr>)) in Pipeline.php line 104</li> <li>at <abbr title="Illuminate\Pipeline\Pipeline">Pipeline</abbr>->then(object(<abbr title="Closure">Closure</abbr>)) in Kernel.php line 150</li> <li>at <abbr title="Illuminate\Foundation\Http\Kernel">Kernel</abbr>->sendRequestThroughRouter(object(<abbr title="Illuminate\Http\Request">Request</abbr>)) in Kernel.php line 117</li> <li>at <abbr title="Illuminate\Foundation\Http\Kernel">Kernel</abbr>->handle(object(<abbr title="Illuminate\Http\Request">Request</abbr>)) in index.php line 53</li> <li>at <abbr title=""></abbr>require_once('G:\Laravel-Xampp7\htdocs\ecommerce\public\index.php') in server.php line 21</li> </ol> </div> </div> </body> </html>
your error says you are using rules undeclared static property of your model App\Image
if its static property you need to declare it in your model App\Image using
public static $rules = ['image' => 'required'];
I made a form to send email on a website built on Laravel. It used to work without problems, but then I added an html/css template to the email. The user should receive an html/css template in the email, but is receiving only text.
This is my send function
public function sendmail(Request $request)
{
$str = preg_replace('/\s\s+/', ' ', $request->emails);
$arr=explode(" ", $str);
$emails = array_slice($arr, 1, -1);
$subject = $request->subject;
$body = $request->body;
$sent = 0;
$declined = 0;
$decEmails=[];
$send = 0;
$declined = 0;
foreach($emails as $email)
{
$send = Mail::send(['html' => 'pages.sendemail'],['subject'=>$subject, 'body'=>$body], function($message) use ($email, $subject)
{
$message->to($email)->subject($subject);
});
if( $send == 1 )
{
$sent++;
}
else
{
array_push($decEmails, $email);
$declined++;
}
}
return view('sent', compact('sent','declined','decEmails') );
}
and this is my view
<!DOCTYPE html>
<html>
<head>
<title>Ebay Georgia</title>
<!--<link type="image/x-icon" rel="icon" href="images/icon.ico">-->
<meta charset="utf-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta name="SKYPE_TOOLBAR" content="SKYPE_TOOLBAR_PARSER_COMPATIBLE" />
<script>
document.createElement("header");
document.createElement("nav");
document.createElement("footer");
document.createElement("section")
</script>
<style>
*{ margin:0; padding:0}
html, body{width:100%; min-height:100%;}
a{ text-decoration:none;}
li{ list-style-type:none;}
img{border:0;}
#font-face {
font-family: 'Conv_BPG DejaVu Sans ExtraLight 2012';
src: url('fonts/BPG DejaVu Sans ExtraLight 2012.eot');
src: local('☺'), url('fonts/BPG DejaVu Sans ExtraLight 2012.ttf') format('truetype'), url('../fonts/BPG DejaVu Sans ExtraLight 2012.svg') format('svg');
font-weight: normal;
font-style: normal;
}
#font-face {
font-family: 'Conv_BPG DejaVu Sans ExtraLight Caps 2012';
src: url('fonts/BPG DejaVu Sans ExtraLight Caps 2012.eot');
src: local('☺'), url('fonts/BPG DejaVu Sans ExtraLight Caps 2012.ttf') format('truetype'), url('../fonts/BPG DejaVu Sans ExtraLight Caps 2012.svg') format('svg');
font-weight: normal;
font-style: normal;
}
/*main css*/
#wrapper{
width:92%;
max-width:600px;
padding:29px 4% 10px 4%;
background:#1c75d7 url(../images/corner.png) no-repeat right bottom;
background-size:auto 100%;
margin:50px auto;
}
#maincContent{
-webkit-box-shadow: 0px 0px 4px 2px rgba(0,0,0,0.24);
-moz-box-shadow: 0px 0px 4px 2px rgba(0,0,0,0.24);
box-shadow: 0px 0px 4px 2px rgba(0,0,0,0.24);
background-color:#fff;
margin-bottom:13px;
position:relative;
clear:both;
overflow:hidden;
border-bottom-right-radius:40px;
}
#head{
width:92%;
max-width:550px;
margin:25px auto;
}
#head h1{
width:94px;
height:47px;
margin:25px 5.45%;
}
#head h1 a{
display:block;
text-indent:-9999px;
width:100%;
height:100%;
background: url(../images/logo.png) no-repeat center center;
}
#content{
width:92%;
max-width:550px;
margin:25px auto;
}
#content h2{
color:#5c5c5c;
font-size:15px;
margin-bottom:20px;
font-family: 'Conv_BPG DejaVu Sans ExtraLight 2012';
margin:0px 5.45% 25px 5.45%;
}
#content .parpagraph{
color:#5c5c5c;
font-size:15px;
margin-bottom:20px;
font-family: 'Conv_BPG DejaVu Sans ExtraLight 2012';
font-weight:600;
margin:0px 5.45% 25px 5.45%;
}
#content .parpagraphGreen{
color:#86b817;
font-size:14px;
margin-bottom:20px;
font-family: 'Conv_BPG DejaVu Sans ExtraLight Caps 2012';
font-weight:600;
margin:0px 5.45% 44px 5.45%;
}
#content img{
display:block;
margin:0px 5.45% 60px 5.45%;
}
#maincContent::after {
content: "";
position: absolute;
z-index:2;
bottom: 0;
right: 0%;
width: 0px;
height: 0px;
border-top:35px solid #dbdbdb;
border-right: 35px solid #dbdbdb;
#footer{
width:92%;
max-width:550px;
margin:0 auto;
}
#footer ul{
margin-left:7%;
overflow:hidden;
}
#footer ul li{
display:inline-block;
float:left;
width: 31px;
height:35px;
margin-right:2%;
}
#footer ul li a{
display:block;
width:100%;
height:100%;
text-indent:-9999px;
margin-bottom:8px;
}
#footer ul li a.mail{
background:url(../images/mail.png) no-repeat center center;
}
#footer ul li a.fb{
background:url(../images/fb.png) no-repeat center center;
}
#footer ul li a.link{
background:url(../images/link.png) no-repeat center center;
}
</style>
</head>
<body>
<section id="wrapper"><!--id="wrapper"-->
<section id="maincContent"><!--id="maincContent"-->
<header id="head"><!--header-->
<h1>Ebay Georgia</h1>
</header><!--End of header-->
<section id="content"><!--id="content"-->
<h2> {!! $subject !!}</h2>
<div class="parpagraph">
{!! $body !!}
</div><br>
<div class="parpagraphGreen">
მადლობა ჩვენი სერვისით სარგებლობისთვის.
</div>
<img src="../images/line.png" alt="#" />
</section><!--End of id="content"-->
</section><!--En dof id="maincContent"-->
<footer id="footer"><!--id="footer"-->
<ul>
<li>mail</li>
<li>facebook</li>
<li>link</li>
</ul>
</footer><!--End of id="footer"-->
</section><!--End of id="wrapper"-->
</body>
</html>
By default, the view given to the Mail::send() method is assumed to contain HTML. So no need to give html key to your view array, this should work:
Mail::send('pages.sendemail', ['subject'=>$subject, 'body'=>$body]...
But if you want to send a plain text you must define it as ['text' => 'pages.sendemail'].
I have a horizontal navigation bar with the first link in the navigation bar "products" having a vertical drop down menu. This was working not long ago then when I added more content to this website today the sub menu for "products" disappeared, I do not know how to get it working again or why it stopped working in the first place.
Any ideas??
here is my code:
(the html part is in li class"products" in div id"navigation", and the css part for the sub menu is where I've commented "/products menu/". I've place all the code here as the error happened only after I added more code, it was working before. So maybe I have an error in other parts too which is preventing the sub menu from working, not sure though. )
html:
<body>
<div id="wrapperContainer">
<div id ="container">
<!-- header -->
<div id = "header">
<!-- logo -->
<div id = "logo">
<img src = "images/TelefunkenLogo.png" width="132" height="20"/>
</div>
<!-- close logo -->
<!-- contact/languages/flag -->
<div id = "rightHeader">
<ul>
<li>CONTACT</li>
<li onclick="location.href='#languageContainer';"><a href ="#" >SELECT COUNTRY</a></li>
<li class = "flag"><img src = "images/germany.png"/></li>
</ul>
</div>
<!-- close contact/languages/flag -->
</div>
<!-- close header -->
<!-- drop down language options -->
<div class="languageContainer">
<!-- left options-->
<div id="leftLanguageContainer">
<ul>
<li><img src = "images/england.png"/>INTERNATIONAL - English</li>
<li><a id="selectCountry" href="#"><img src = "images/germany.png"/>DEUTSCHLAND - Deutsch</a></li>
</ul>
</div>
<!-- close left options-->
<!-- cross -->
<a class="closeCross" title="Close" href="#">
<span></span>
</a>
<!-- close cross -->
</div>
<!-- close drop down language options -->
<!-- navigation -->
<div id="navigation">
<!-- menu items -->
<ul class="menu">
<li class="home"><img src="images/homeButton.png" alt="Telefunken"/></li>
<li class="products" >PRODUCTS
<ul class="subMenu">
<li><img src="images/product1.jpg" alt="Telefunken"/>some text</li>
<li><img src="images/product2.jpg" alt="Telefunken"/></li>
<li><img src="images/product3.jpg" alt="Telefunken"/></li>
<li><img src="images/product4.jpg" alt="Telefunken"/></li>
<li><img src="images/product5.jpg" alt="Telefunken"/></li>
<li><img src="images/product6.jpg" alt="Telefunken"/></li>
<li><img src="images/product7.jpg" alt="Telefunken"/></li>
<li><img src="images/product8.jpg" alt="Telefunken"/></li>
<li><img src="images/product9.jpg" alt="Telefunken"/></li>
</ul>
</li>
<li class="company">COMPANY</li>
<li class="service">SERVICE</li>
<li class="news">NEWS</li>
</ul>
<!-- close menu items -->
<!-- search function -->
<div id="searchWrapper">
<div id="search">
<form action="searchresult/" method="post" onsubmit="return searchAction(this)">
<input type="text" name="tx_indexedsearch[sword]" value>
<input type="hidden" id="searchProductUrl" name="searchProductURL" value="searchresultproducts/">
<select name="page"id="selectPage">
<option value="1">WEBSITE</option>
<option value="2">PRODUCTS</option>
</select>
<div id="submitButton">
<input type="submit" value class ="btnSubmit">
</div>
</form>
</div>
</div>
<!-- close search function -->
</div>
<!-- close navigation -->
</div>
<!-- close container -->
<div class="slider" >
<img src="images/sliderBkg.jpg" alt="alt text" width="100%" />
<div id="sliderImages">
<img class="img" style="width:983.5px; margin: 0 auto" src="images/sliderLEDTV.jpg">
<!--<img class="img" style="width:983.5px" src="images/sliderCamcorder.jpg">
<img class="img" style="width:983.5px" src="images/sliderSystemPa.jpg">-->
</div>
</div>
<!-- slider
<div class="slider" style="width:100%;">
<img class="img" style="width:983.5px" src="images/sliderLEDTV.jpg">
</div>-->
<!--<img class="img"src="images/sliderLEDTV.jpg">
<img class="img"src="images/sliderCamcorder.jpg">
<img class="img"src="images/sliderSystemPa.jpg">-->
<!-- close slider -->
<!-- lower content -->
<div id="lowerContent">
<div id="leftContent">
<h1>RECENT PRODUCTS</h1>
<div class="inline"><div id ="product1">
<img src="images/recentProducts1.jpg">
<h2>PORTABLE </br>STEREO RDS RADIO</h2>
<p>Some Text.</p>
<span class=">" style="font-size=0.7em; color:#F00; font-family:'Arial', 'Gill Sans', 'Myriad Pro', 'DejaVu Sans Condensed', Helvetica, Arial, sans-serif;"> > </span> <span class="more" style="color:#000000; font-size:0.7em; font-family:'Arial', 'Gill Sans', 'Myriad Pro', 'DejaVu Sans Condensed', Helvetica, Arial, sans-serif;"> more</span>
</div></div>
<div class="inline"><div id ="product2">
<img src="images/recentProducts2.jpg">
<h2>ICONCERTO </br>I-POD PLAYER</h2>
<p>Some Text.</p>
<span class=">" style="font-size=0.7em; color:#F00; font-family:'Arial', 'Gill Sans', 'Myriad Pro', 'DejaVu Sans Condensed', Helvetica, Arial, sans-serif;"> > </span> <span class="more" style="color:#000000; font-size:0.7em; font-family:'Arial', 'Gill Sans', 'Myriad Pro', 'DejaVu Sans Condensed', Helvetica, Arial, sans-serif;"> more</span>
</div></div>
<div class="inline"><div id ="product3">
<img src="images/recentProducts3.jpg">
<h2>T9HD </br>42" (106 CM) LOREM</h2>
<p>Some Text.</p>
<span class=">" style="font-size=0.7em; color:#F00; font-family:'Arial', 'Gill Sans', 'Myriad Pro', 'DejaVu Sans Condensed', Helvetica, Arial, sans-serif;"> > </span> <span class="more" style="color:#000000; font-size:0.7em; font-family:'Arial', 'Gill Sans', 'Myriad Pro', 'DejaVu Sans Condensed', Helvetica, Arial, sans-serif;"> more</span>
</div></div>
</div>
<div id="rightContent">
</div>
</div>
<!-- close lower content -->
<!-- footer -->
<div id="footer">
</div>
<!-- footer -->
</div>
</body>
css:
#charset "utf-8";
/* CSS Document */
/*all content sits in here*/
#wrapperContainer {
width:100%;
}
#container {
width:983.5px;
margin:0px auto;
}
h1 {
font-family:"Arial", "Gill Sans", "Myriad Pro", "DejaVu Sans Condensed", Helvetica, Arial, sans-serif;
font-size: 1em;
color:#7f7f7f;
}
h2 {
font-family:"Arial", "Gill Sans", "Myriad Pro", "DejaVu Sans Condensed", Helvetica, Arial, sans-serif;
font-size: 0.8em;
color:#000000;
}
p {
font-family:"Arial", "Gill Sans", "Myriad Pro", "DejaVu Sans Condensed", Helvetica, Arial, sans-serif;
font-size: 0.7em;
color:#666666;
}
a:link {
text-decoration:none;
}
a:visited{
text-decoration:none;
}
a:hover{
color:#d34242;
}
/*header*/
#header {
margin: 0 auto;
padding: 20px 0 0px 0;
height: 60px;
width: 983px;
}
/*logo in header*/
#logo {
float: left;
}
/*links to the right of the header*/
#rightHeader {
float: right;
}
/*styling the header links*/
#rightHeader li {
display: inline;
list-style-type: none;
padding: 5px;
border-right:1px solid #dbdbdb;
padding-right:10px;
}
#rightHeader li a:link {
text-decoration: none;
font-size: 12px;;
font-family: "Arial", "Gill Sans", "Myriad Pro", "DejaVu Sans Condensed", Helvetica, Arial, sans-serif;
color: #b2b2b2;
}
#rightHeader li a:visited {
text-decoration: none;
text-size: 0.01em;
font-family: "Arial", "Gill Sans", "Myriad Pro", "DejaVu Sans Condensed", Helvetica, Arial, sans-serif;
color: #b2b2b2;
}
a.selectCountry:hover + .languageContainer {
visibility: visible;
}
#rightHeader li a:hover {
text-decoration: none;
font-family: "Arial", "Gill Sans", "Myriad Pro", "DejaVu Sans Condensed", Helvetica, Arial, sans-serif;
color: #cc0000;
}
/*this is meant to display the language options when you click on 'select country'*/
.languageContainer {
cursor:pointer;
margin: 0 auto;
position:relative;
display:none;
padding: 20px 0 0px 0;
width: 983px;
height: 70px;
border:1px solid #b2b2b2;
}
/*language options*/
#leftLanguageContainer li {
display: inline;
float: left;
padding:30px;
margin-left:-40px;
padding-top:0px;
}
/*language options styling*/
#leftLanguageContainer li a:link {
text-decoration: none;
font-size: 9px;
font-family: "Arial", "Gill Sans", "Myriad Pro", "DejaVu Sans Condensed", Helvetica, Arial, sans-serif;
color: #b2b2b2;
}
#leftLanguageContainer li a:visited {
text-decoration: none;
font-family: "Arial", "Gill Sans", "Myriad Pro", "DejaVu Sans Condensed", Helvetica, Arial, sans-serif;
color: #b2b2b2;
}
#leftLanguageContainer li a:hover {
text-decoration: none;
font-family: "Arial", "Gill Sans", "Myriad Pro", "DejaVu Sans Condensed", Helvetica, Arial, sans-serif;
color: #cc0000;
}
/*cross in the language container*/
a.closeCross {
background-image:url('images/closeCross.png');
display:block;
width:30px;
height:30px;
margin-top:-36px;
float:right;
overflow: hidden;
text-decoration:none;
}
a.closeCross:hover {
background-image:url('images/closeCrossHover.png');
}
/*main navigation*/
#navigation {
background-image:url(images/menuBkg.png);
background-repeat: no-repeat;
height:40px;
width:103%;
z-index:999;
position:absolute;
overflow:hidden;
}
/*setting height of the menu*/
.menu {
height:40px;
}
/*styling the home button*/
.menu li.home {
display:inline;
position:relative;
left:-40px;
top:-25px;
height:43px;
width:40px;
padding:0px;
}
/*products menu*/
.menu li ul.subMenu {
margin:0px;
display:none;
padding:0px;
background:#FFFFFF;
width:985px;
top:40px;
height:250px;
}
.menu li:hover ul.subMenu {
display:block;
width:970px;
}
.menu li li {
list-style:none;
display:list-item;
width:100%;
top:0px;
left:10px;
line-height:2px;
background:#FFFFFF;
}
.menu ul.subMenu li {
display:inline;
list-style:none;
position:relative;
}
.menu li ul.subMenu {
margin:0px;
padding:0px;
display:none;
position:absolute;
}
/* trying to set a width to each 'li' in the subMenu to get the text to move below the image
.menu li ul.subMenu li {
width:10px;
}*/
.subMenu a:hover {
color:#603;
/*border properties*/
}
/*end products menu*/
/*styling individual menu links*/
.products {
border-right: 1px solid #eaeaea;
border-left: 1px solid #c9c9c9;
}
.products:hover {
background-image:url(images/pressed2.jpg);
background-repeat: no-repeat;
top:-40px;
background-size: 120px 40px;
font-color: #FFFFFF;
color: #FFFFFF;
}
.company {
border-right: 1px solid #eaeaea;
border-left: 1px solid #c9c9c9;
width:120px;
}
.company:hover {
background-image:url(images/pressed2.jpg);
background-repeat: no-repeat;
top:-40px;
background-size: 120px 40px;
font-color: #FFFFFF;
color: #FFFFFF;
}
.service {
border-right: 1px solid #eaeaea;
border-left: 1px solid #c9c9c9;
margin-left:-4px;
}
.service:hover {
background-image:url(images/pressed2.jpg);
background-repeat: no-repeat;
top:-40px;
background-size: 120px 40px;
font-color: #FFFFFF;
color: #FFFFFF;
}
.news {
border-right: 1px solid #eaeaea;
border-left: 1px solid #c9c9c9;
margin-left:-4px;
}
.news:hover {
background-image:url(images/pressed2.jpg);
background-repeat: no-repeat;
top:-40px;
background-size: 120px 40px;
font-color: #FFFFFF;
color: #FFFFFF;
}
/*all menu links in navigation bar*/
.menu li {
display:inline;
position:relative;
bottom:45px;
right:50px;
width:130px;
height:43px;
padding:15px;
}
.menu li a:link {
font-family:"Arial", "Gill Sans", "Myriad Pro", "DejaVu Sans Condensed", Helvetica, Arial, sans-serif;
font-size:0.8em;
width:120px;
height:43px;
text-decoration:none;
color: #000000;
}
.menu li a:visited {
font-family:"Arial", "Gill Sans", "Myriad Pro", "DejaVu Sans Condensed", Helvetica, Arial, sans-serif;
font-size:0.8em;
width:120px;
height:43px;
text-decoration:none;
color: #000000;
}
.menu li a:hover {
font-family:"Arial", "Gill Sans", "Myriad Pro", "DejaVu Sans Condensed", Helvetica, Arial, sans-serif;
font-size:0.8em;
text-decoration:none;
color: #FFFFFF;
}
/*search bar in navigation*/
#searchWrapper {
height:100px;
left:212px;
/*float:right;*/
position:relative;
}
#search{
left:80px;
top:70px;
}
/*puts everything in the menu on the same line. */
.menu, #searchWrapper, #search, #submitButton {
display: inline-block;
vertical-align: top;
}
#submitButton {
z-index:1;
}
.btnSubmit {
border:0;
width:40px;
height: 40px;
top:10px;
background-image:url(images/rightArrow.jpg);
}
.btnSubmit:hover {
background-image:url(images/rightArrowPressed.jpg);
}
/*style slideshow*/
.slider {
height: 420px;
overflow:hidden;
}
#sliderImages {
}
/*#slideshow, #navigation {
display: inline-block;
vertical-align: top;
}
#slideshow {
margin-top:-40px;
margin-left: -30px;
}*/
#lowerContent{
margin: 0 auto;
padding: 0px 0 0px 0;
width: 983px;
}
#leftContent {
padding-left:10px;
width:750px;
display:inline;
}
.inline {
float: left;
}
#product1 {
width:240px;
border-right: 1px solid #dbdbdb;
}
#product2 {
width:240px;
padding-left:40px;
border-right: 1px solid #dbdbdb;
}
#product3 {
width:240px;
padding-left:40px;
border-right: 1px solid #dbdbdb;
}
I have a website I'm working on and I'm positive it is something obvious that I'm overlooking here.
My main issue and why I'm here: My page looks great in Chrome and Safari, but FF v.21 (Mac) takes the textcont and linkcont layers and puts them all the way to the right, outside of the container I have for them. I know they are floating, but I can't seem to get them to show correctly there.
*EDIT: 6-18 # 1p--*I solved the other issue, but Firefox still is putting the two inner containers OUTSIDE of the main content container.
*EDIT: 6-20 # 9:45a--*I found that if I added "Position: absolute;" to the #contentbox, everything seemed to work in Chrome, Safari, and Firefox (can't test it on IE currently), BUT my #copybox div (last layer that displays the year with copyright at the very bottom) would align overtop of the #contentbox at the top. I tried using absolute position on that div, but just made it visible, relative made it hidden--but still up top where it shouldn't be. Any ideas? If I can get the absolute positioning to work on the content, I just need a fix to keep the #copybox following the end of the #contentbox layer.
Firefox Screenshot: http://i41.tinypic.com/20t0xh0.png
Chrome/Safari (correct): http://i40.tinypic.com/a4y1ar.png
Style Code:
#charset "UTF-8";
/* CSS Document */
body {
background-color: #FAD434;
font-family: Helvetica, arial, sans-serif;
font-size: 14px;
}
#container {
width: 100%;
padding: 0px;
margin: 0 auto;
}
#headercont {
width: 900px;
margin: 0 auto;
}
#header {
width: 100%;
height: 65px;
margin: 0 auto;
background-color: #000000;
background-image:url(img/logo.png);
background-repeat: no-repeat;
background-position: left;
border-bottom: 2px solid #fad434;
}
#picheader {
height: 360px;
background-image:url(img/NHYC_BoySmile.jpg);
background-repeat: no-repeat;
background-position: top center;
}
#contentbox {
width: 100%;
background-image: url(img/content_bkgd.jpg);
background-position: bottom center;
background-repeat: repeat-x;
background-color: #ffffff;
margin-top: 0px;
padding-bottom: 50px;
}
#contentcont {
width: 900px;
margin: 0 auto;
overflow: auto;
}
#textcont {
width: 70%;
padding: 0px 0px 25px 10px;
float: left;
}
#linkcont{
width: 25%;
padding-top: 63px;
padding-right: 10px;
padding-left: 10px;
float: right;
}
#copybox {
width: 100%;
font-size: 10px;
text-align: center;
padding: 15px;
}
/* --- HEADER TEXT --- */
h1 {
font-size: 40pt;
color: #f28c3d;
border-bottom: 2px solid #FAD434;
text-transform: uppercase;
}
h2 {
font-size: 24 pt;
color: #f28c3d;
border-bottom: 2px solid #FAD434;
text-transform: uppercase;
}
h3 {
font-size: 18 pt;
color: #f28c3d;
border-bottom: 2px solid #FAD434;
text-transform: uppercase;
}
/* --- LINK LIST --- */
.links li {
list-style-type:none;
line-height: 20pt;
}
/* --- MENU --- */
#menu {
width: 100%;
margin: 0 auto;
padding-top: 325px;
}
#menu ul, #menu ul ul {
list-style-type: none;
padding: 0;
margin: 0 auto;
}
#menu ul li{
padding: 10px 25px;
position: relative;
float: left;
-webkit-border-radius: 5px;
-moz-border-radius: 5px;
border-radius: 5px;
text-transform: uppercase;
}
#menu ul a:link, #menu ul a:visited{
display: inline-block;
color: #ffffff;
width: 90px;
padding: 5px;
text-decoration: none;
font-size: 12px;
font-weight: bold;
text-align: center;
}
#menu ul a:hover, #menu ul a:active {
background: #f28c3d;
-webkit-border-radius: 5px;
-moz-border-radius: 5px;
border-radius: 5px;
}
Index.php Code:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>NHYC - Ohio</title>
<link href="nhyc_styles.css" rel="stylesheet" type="text/css" />
</head>
<body>
<div id="container">
<div id="headercont">
<div id="header">
<p align="right"><img src="img/socialmedia_icons.png" alt="Social Media" border="0" usemap="#socialmedia" style="padding-right:15px; padding-top: 18px;"/>
<map name="socialmedia" id="socialmedia">
<area shape="rect" coords="2,4,27,25" href="#" target="_blank" alt="Facebook" />
<area shape="rect" coords="42,4,69,24" href="#" target="_blank" alt="Twitter" />
</map>
</p>
</div> <!--End of header-->
<div id="picheader">
<div id="menu">
<ul>
<li>About Us</li>
<li>Mission</li>
<li>Services</li>
<li>Admission</li>
<li>Employment</li>
<li>Contact</li>
</ul>
</div>
<!--End of navigation-->
</div> <!--End of picheader-->
</div> <!--End of headercont-->
<div id="contentbox">
<div id="contentcont">
<div id="textcont">
<?php
if (!isset($_REQUEST['topic']))
include("aboutus.php");
else
{
$topic = $_REQUEST['topic'];
$nextpage = $topic . ".php";
include($nextpage);
} ?>
</div><!--End of textcont-->
<div id="linkcont">
<h3>Resources</h3>
<ul class="links">
<li>Link #1</li>
<li>Link #2</li>
<li>Link #3</li>
<li>Link #4</li>
</ul>
</div> <!--End of linkcont-->
</div>
</div> <!--End of contentbox-->
</div> <!--End of container-->
<div id="copybox">
2013 © NHYC
</div> <!--End of copybox -->
</body>
</html>
#contentbox {
overflow: hidden;
}
...will correct your issue.
You have an uncleared float there, and overflow: hidden will clear it. Read more about block formatting context (the weird hidden CSS nuance that overflow: hidden applies) here.