Anyone interested in sharing their atom/vscode settings on my project?
anyone doing anything interesting?
hi i have infact added the scripts but the console says file not found
is there anything wrong
hi i have infact added the scripts but the console says file not found
@gauravmagan - is this a codepen project? Do you have the full URL for the files - starting with
https:// ?
I guess I cannot see what you have in the
assets folder...
I haven't used a CodePen project, so can you share the URL for it?
@gauravmagan It looks like maybe the file path is incorrect. about.html is in the views folder, to use
src='assets/etc' the assets folder needs to be in the same directory as about.html
so just go up a level
I think
src='/assets/etc' should do it
so it will start looking for assets from the project root directory not the folder it currently is in
can someone tell me why offset isnt working on my code ?
</head>
<body class="container-fluid">
<header class="row">
<div class="col-md-6 col-md-offset-3">
<h1>Random Quote Generator</h1>
<h2>Inspirational Quotes</h2>
</div>
</header>
</head>
<body class="container-fluid">
<header class="row">
<div class="col-md-6 col-md-offset-3">
<h1>Random Quote Generator</h1>
<h2>Inspirational Quotes</h2>
</div>
</header>
Most likely no on what you provided. You should post your whole code. Best would be to put it in codepen and then link it here
i just tried it on codepen and it works, but not on my file
@DMsalati it doesn't work on which file?
@DMsalati if it works on codepen and not somewhere else maybe it's how you set up your file. Make sure bootstrap is uploaded. I see nothing wrong with your code. Another thing you could do is col-md-12 and text-align center in your styling. That's the same thing as md-6 and offset-3 it sounds like it me.
I am not entirely sure what following two programs do:
function showPrimes(n) {
nextPrime: for (let i = 2; i < n; i++) {
for (let j = 2; j < i; j++) {
if (i % j == 0) continue nextPrime;
}
console.log( i );
}and
function showPrimes(n) {
for (let i = 2; i < n; i++) {
if (!isPrime(i)) continue;
alert(i);
}
}
function isPrime(n) {
for (let i = 2; i < n; i++) {
if ( n % i == 0) return false
}
return true;
}These are two examples available on JS.info website. None of them log or alert anything. :(
Is anyone available at this time?
@ajbozdar Those are functions - they have to be called to do anything. Do you have code that calls the functions?
I know they are functions. There are
alert and console.log to test them.
@ajbozdar If you call the first one
showPrimes(10) for example it will console log out 2, 3, 5, 7
@ajbozdar The code you posted for the first one is missing the last
} but I am guessing it is there in the real code
@ajbozdar - running the first one
showPrimes(10)
2
3
5
7
@sjames1958gm Let me check.
Hey, I am facing a rather weird problem. I have served pages via nodejs, and the problem is as I scroll up and down, the elements take a second to appear, it doesn't happen all the time, but let's 2 out of 5 times, this happens
@sjames1958gm What is
continue in program? How it works? What's its coding name? Is it kind of an attribute?
@ajbozdar
continue inside a loop will jump to the next loop iteration (or if it has a label (here nextPrime)) it will jump to the label.
I have seldom, almost never, seen
continue inside a loop will jump to the next loop iteration (or if it has a label (here nextPrime)) it will jump to the label.
I have seldom, almost never, seen
continue <label> in real code.
Is my program error free now?
function showPrimes(n) {
nextPrime: for (let i = 2; i < n; i++) {
for (let j = 2; j < i; j++) {
if (i % j == 0) continue nextPrime;
}
console.log( i ); // a prime should be logged in console.
}
}
showPrimes(10);It still logs nothing.
I changed
n to 10; no response.
@relentless-coder Are these basic HTML pages? Do they load a lot of extra files? Does it only happen when you scroll right after the page is loaded?
I would open devtools and use the network tab to see if there is a loading delay, at least start there
I would open devtools and use the network tab to see if there is a loading delay, at least start there
@ajbozdar Where are you calling the function?
There needs to be a line of code after the function like
There needs to be a line of code after the function like
showPrimes(10)
If you have never seen
continue in real code then JS.info is probably overusing labels.
@ajbozdar The second example has continue without the label, that is what I usually see.
Oops! My mistake. I am sorry. Look onto above code. It is just there in the end.
You mean second code is better than the first code, right?
@ajbozdar Yes, I believe so
@ajbozdar by just having the function called isPrime it is much easier to know what the code is doing.
Can anyone tell me how border-image-slice Property works ?
how is it working ?
did u read that?
yse
yes
@ahmed-issa-mohd It is saying how much of the border image to I slice off (how much do I use) to fill the border.
A larger number picks more of the image for the border (which then scales the image down to fit in the border)
A larger number picks more of the image for the border (which then scales the image down to fit in the border)
thankS
@ahmed-issa-mohd :+1:
Helooo
Hi @eclip-se
guys, i'm trying to learn all this stuff and i'm locked in choice when i'll think about time and what should i really focus on.. i have some knowledge already, but when i'll try to analyze and rethink whats really hapenning in term of pure hmtl/css for the start, i dont know how to train myself with project. Currently my idea is to look at themeforest or other theme selling site, pick one design, open in photoshop make notes like this .
the question is, what should i focus on and what project i should start with to learn efficiently.
work through the FCC projects maybe?
maybe yes, before i go there, i wanted to ask here ..
asking here is more an insight, another source and point of view.
sorry but that's what im doing, im just working on the FCC ones. Maybe others more experienced could give you better advice @eclip-se
Thanks man! :)
You're welcome :) @eclip-se
@sjames1958gm hey, I have checked that already, and all files are loaded. Also, this weird behavior happens whenever I scroll a bit fast
hey! i m not able to move my 'About Portfolio Contact' to the left by using 'float: left' in CSS. Help me out.
here is my link: https://codepen.io/pragyapriya/pen/OQMYJw
@pragya1248 its on the left
oh yeah
sorry
@pragya1248 so did you need help?
@relentless-coder So just plain HTML/CSS no React or Angular or other rendering framework?
@sjames1958gm ejs templates rendered as html through nodejs
@relentless-coder THat is odd, if everything is already loaded then I wouldn't expect scrolling issues.
Any dynamic (js) behavior on scrolling.
Any dynamic (js) behavior on scrolling.
@sjames1958gm yes, I am toggling display of a div based on the scroll height.
let me try removing that first
@relentless-coder I don't have any special insight, just asking the questions I'd ask myself
Does
prompt function accept integers?
function pairElement(str) {
var arr = [[],[]];
var i = 0;
// return len = str.length;
while(i < str.length)
{
if(str[i] == 'G')
{
arr[i][0] ="G";
arr[i][1] = "C";
}
//if(str[i] == 'C')
// {
// arr[i][0] ="G";
// arr[i][1] = "C";
// }
/* if(str[i] == 'C')
{
arr[i][0] ="C";
arr[i][1] = "G";
}
if(str[i] == 'T')
{
arr[i][0] = "T";
arr[i][1] = "A";
}
if(str[i] == 'A')
{
arr[i][0] = "A";
arr[i][1] = "T";
}
*/
i++;
}
return arr;
}
pairElement("GCG");
@ajbozdar How do you mean accept?
You give integer to prompt to display?
User enters integer?
You give integer to prompt to display?
User enters integer?
@1532j0004kg Since you don't know string.length ahead of time, you should probably add to
with hardcoded two []
arr a different way rather thanwith hardcoded two []
this code shows the error
but when i replace the i with 0 , its executing , can u please help me to solve this !
but when i replace the i with 0 , its executing , can u please help me to solve this !
I ask user to enter a number then I want to add and console log the addition.
trynna design a webpage for a porject, but not really creative, can anyone give me ideas please?
let addition = prompt("Your Number");
let sum = (addition + 7);
console.log(sum);
However I get concatenation in the end.
@ajbozdar The user can enter a number, but the value returned is a string.
use parseInt to convert string to number
use parseInt to convert string to number
parseInt ???
@sjames1958gm can u explain better , please
@sjames1958gm hey, i figured it out. I accidentally placed code highlighting service inside the
scroll event .
then how " if i giving the value directly " it works ?
@relentless-coder Cool ! Always fun to find the problem
function pairElement(str) {
var arr = [[],[]];
var i = 0;
// return len = str.length;
while(i < str.length)
{
if(str[i] == 'G')
{
arr[0][0] ="G";
arr[0][1] = "C";
}
//if(str[i] == 'C')
// {
// arr[i][0] ="G";
// arr[i][1] = "C";
// }
/* if(str[i] == 'C')
{
arr[i][0] ="C";
arr[i][1] = "G";
}
if(str[i] == 'T')
{
arr[i][0] = "T";
arr[i][1] = "A";
}
if(str[i] == 'A')
{
arr[i][0] = "A";
arr[i][1] = "T";
}
*/
i++;
}
return arr;
}
pairElement("GCG");
like this
@1532j0004kg
var arr = [[], []] this assumes only two values in the string.
@sjames1958gm This is interesting.
@1532j0004kg Push the new array onto
arr
@1532j0004kg like arr.push(["G", "C"]);
start with arr empty
start with arr empty
@ajbozdar did you get it?
I get it. @sjames1958gm Is it possible to do without parseInt? I'm sharing my function now.
function add7() {
let addition = parseInt(prompt('your integer please')) + 7;
console.log(addition);
}
add7();
@sjames1958gm thanks
1532j0004kg sends brownie points to @sjames1958gm :sparkles: :thumbsup: :sparkles:
:star2: 8931 | @sjames1958gm |http://www.freecodecamp.org/sjames1958gm
@ajbozdar Well you can use a leading
+ to convert a string to numbervar one = "1"
+one + 2
Is my function useful? @sjames1958gm
@ajbozdar If you need to add 7 a lot then yes :)
@sjames1958gm Thank you :D
ajbozdar sends brownie points to @sjames1958gm :sparkles: :thumbsup: :sparkles:
:star2: 8932 | @sjames1958gm |http://www.freecodecamp.org/sjames1958gm
@ajbozdar Well, let me say that a function should probably return the addition
function add7() {
let addition = parseInt(prompt('your integer please')) + 7;
return addition;
}
@ajbozdar A more javaScript way would be to remove the addition variable;
function add7() {
return parseInt(prompt('your integer please')) + 7;
}
@sjames1958gm its working suuccessfully , but still i have a dought .
function pairElement(str) {
var arr = [[],[]];
var i = 0;
while(i < str.length)
{
if(str[i] == 'G')
{
arr[0][0] ="G";
arr[0][1] = "C";
}
if(str[1] == 'C')
{
arr[1][0] ="G";
arr[1][1] = "C";
}
i++;
}
return arr;
}
pairElement("GCG");
how its working ?
it output correctly !!!
@1532j0004kg No it doesn't - it only outputs an array of two it should be three elements
@1532j0004kg
For example, for the input GCG, return [["G", "C"], ["C","G"],["G", "C"]]
Your code outputs
[["G", "C"], ["G", "C"]]
@sjames1958gm Function should
return the addition but to see the addition either I need to alert or console.log. Am I right?
@ajbozdar In this simple case yes, but the caller of your function could show it.
console.log(add7());
ok @sjames1958gm yes its outputing like u said !\
but still i knew the string length right ?
can anyone help me think of what to put on my webpage for this project please?
then how its not working ?
@sjames1958gm That's precise and exact. I like it. :)
@1532j0004kg
Your code only updates entries 0, 1 in the array so you cannot get three values
Start with
arr = [];
and then push onto that array str.length number of times in your while loop
then it doesn't matter how big str is
var arr = [[],[]]; this code here assumes two values in the string.Your code only updates entries 0, 1 in the array so you cannot get three values
Start with
arr = [];
and then push onto that array str.length number of times in your while loop
then it doesn't matter how big str is
@sjames1958gm In addition to freecodecamp, which lessons on www do you find the best for JS? It seems javascript.info is confusing.
ohhhh ok broieeee , i got it !!!! thanks a lot for ur explanation :sparkles:
w3schools, try it @ajbozdar
@1532j0004kg :+1:
@ajbozdar https://www.w3schools.com/js/default.asp
@515014K thank you
ajbozdar sends brownie points to @515014k :sparkles: :thumbsup: :sparkles:
:cookie: 171 | @515014k |http://www.freecodecamp.org/515014k
how can i make that look better?
@ajbozdar YouTube channels - learncodeacademy is one
Traversy Media this is another
@sjames1958gm :+1: I am looking into them. :)
@MuhammedKarim thank you
ajbozdar sends brownie points to @muhammedkarim :sparkles: :thumbsup: :sparkles:
:cookie: 115 | @muhammedkarim |http://www.freecodecamp.org/muhammedkarim
you're welcome @ajbozdar
@ajbozdar :+1:
Could anyone asnwer my question please?
since that is a poem you could center it, maybe add some color - just enough to hilight it
oh ok, will do @sjames1958gm
@MuhammedKarim I like poetry (English literature and linguistics) very much, but I am not in position to guide you for your Front End Development. However, I would discuss a scenario with you. Here it is: Whenever I read a poem, I imagine how the writer wrote it. For instance: Composed on Westminister Bridge is written by Sir Wordsworth. He wrote it early at the dawn near around Westminister Bridge. I then visualise a river, a bridge, a crescent in sky, and an old man smoking a cigar while wearing a turkish or jewish hat. I would then prefer to design a background for the poem using right colours like black and white in given context.
See that poem is about Madinah, i have pictures just above the poem of Madinah :) I really like ur viewpoint tho! Appreciate it :D @ajbozdar
For your poem you can using green and white colours, choose a background which highlights something significant from Madinah, like the mountains there. You can romanticize the desert even, and grow palm trees.
Have fun, Cheers! @MuhammedKarim
Thanks a lot bro, will see what i can do :) @ajbozdar
muhammedkarim sends brownie points to @ajbozdar :sparkles: :thumbsup: :sparkles:
:cookie: 262 | @ajbozdar |http://www.freecodecamp.org/ajbozdar
I have 262 brownie points. I never knew it. This is amazing. :shipit:
go to your FCC and you can see your brownie points there... i think lol @camperbot
@MuhammedKarim You are welcome. Indeed, I am going to check there.
Good Evening everyone! I wanna start with the Game of Life project but I'm very confused on how to get started and make the grids.. I thought I would make them using divs but then I read in the "Let's Discuss" post of GoL that using divs made the board laggy... please help me on how to go about in this project
Please tell me if I am coding right?
function capitalize() {
let text = prompt("Some text here!");
return text[0].toUpperCase() + text.slice(1);
}
console.log(capitalize());Thanks!
hello guys i gpt stuck here
could you help me
i dont know what i mus to do
the task names it seek and destroy
@rubendmatos1985 What are you not able to understand
@rubendmatos1985 - you have to write a function that will take arguments consisting of an array, which is the initial argument, and then any number of arguments that follow it. A typical invocation of the function will look like this:
destroyer([1, 2, 3, 1, 2, 3], 3, 2); - the array is the first argument [1, 2, 3, 1, 2, 3], and the 3 and 2 are the additional arguments. They have provided a link for the arguments object - you use that to access all of the function arguments, and in this case, you want to use it to get the arguments that follow the initial array. The problem statement says: Remove all elements from the initial array that are of the same value as these arguments. So you find any arguments in the initial array that are contained in the list of the arguments that follow the initial array and remove them, return an array that has any remaining arguments. For the example that I put above, you would remove any 2 and 3 from the initial array, and return [1, 1] You have to be able to handle any number of additional arguments, so this one has two, some have three, but you can write code that will handle any number of arguments, so don't just hard code 2 and 3 as the count of values.
@rubendmatos1985 - as I said, they give a link to the documentation for the Arguments object, and the array
.filter() method. You can also use for loops and just do all of the code that way, or use some of the higher-order functions like filter() to do the job.
Can someone take a look. I created a modal but when I click on the "Add recipe" button it shows nothing. Here is my code:
import React from 'react';
import Modal from 'react-bootstrap-modal';
import ReactDOM from 'react-dom';
export class AddRecipe extends React.Component {
constructor(){
super();
this.state = {
show: false
}
this.closeModal = this.closeModal.bind(this);
this.showModal = this.showModal.bind(this);
}
showModal(){
this.setState({
show: true
});
}
closeModal(){
this.setState({
show: false
});
}
render(){
return (
<div>
<button onClick={this.showModal}>Add Recipe</button>
<Modal show={this.state.show} onHide={this.closeModal}>
<Modal.Header>
<Modal.Title>Add Recipe:</Modal.Title>
</Modal.Header>
<Modal.Body>
<h2>Name:</h2>
<input />
<hr />
<h3>Instructions</h3>
<textarea></textarea>
</Modal.Body>
<Modal.Footer>GG</Modal.Footer>
</Modal>
</div>
);
}
}
ReactDOM.render(<AddRecipe />, document.getElementById('app'));
Why are you calling the function for the modal ? do you want the modal to close once a recipe is added?
Oh nevermind, i never than this project you meant to open the modal.
The problem is that when I click it doesen't open
can you inspect the page and see if the modal is there ? there's some cases that it's just out of the viewport.
I checked it's ok
Still when I click nothing appears
@Teo03 any errors on console?
Only this:
TypeError: Cannot read property 'createClass' of undefined
That means react is not loaded correctly
How did you create this app?
Using
create-react-app?
No, should I send you my package.json?
share you build file instead
is it webpack?
no worries...
yes it's webpack
is it there on github?
I haven't still pushed it
I can do it now if you need
yes please
@SweetCodingInc Here is a link: https://github.com/Teo03/recipe_box
@Teo03 hold on
@SweetCodingInc Ok no problem
@Teo03 just a note.. never push your node_modules to the repo
is it okay if I fork and submit pull request?
@SweetCodingIn Yes of course
how can i align something to the center? not just the text, i mean an element
in html*
@MuhammedKarim
< YourElement style = text-align: center; > </YourElement>The grammar is same for whatever you want to align to the center of your page.
thanks bro but its not working for me :( ill send it to you privately
@ajbozdar Your capitalize function looks correct, but it will only change the first letter of user input
And maybe you should add a check for the empty string
@MuhammedKarim You can sure contact me via private messages, but if you paste your code here, someone will help you out in case I am not available.
@fmartin5 Check for the empty string? Could you please explain this more?
Yes because
text[0] will be undefined if textis empty @ajbozdar
Example
if(text == "") return "";
@Teo03 looks like there is some issue with the library itself
how can i center that iframe with the youtube vid?
@Teo03 jquense/react-bootstrap-modal#54 known issue with react v16 +
@MuhammedKarim - one way that it works is to wrap it in a div, and set a class on the div with the CSS property
text-align: center;
just got it bro @khaduch
iframe {margin:auto; display:block}
@MuhammedKarim :+1:
Is there a better way to validate email other than type validation
With the type validation, I can enter apollo@gmail to submit the email. Is there a way to make entering the domain name required so I'd have to type apollo@gmail.com?
@enigmacipher regular expression
@SweetCodingInc cool. Thanks :smile:
enigmacipher sends brownie points to @sweetcodinginc :sparkles: :thumbsup: :sparkles:
:cookie: 229 | @sweetcodinginc |http://www.freecodecamp.org/sweetcodinginc
@SweetCodingInc Ok, thanks for the help anyway
teo03 sends brownie points to @sweetcodinginc :sparkles: :thumbsup: :sparkles:
:cookie: 231 | @sweetcodinginc |http://www.freecodecamp.org/sweetcodinginc
Hey guys, I'm having some trouble formatting my Social Media buttons in my code. I want them to have a picture of the social media button logo in the middle of them, but Im having trouble trying to get that to work. Can anyone help? Much appreciated! :) Code is Below:
'''
<div id="section4">
<h1 class="text-center">
<strong> Social Media: </strong>
</h1>
<!-- Style buttons with images, find out how to -->
<div id="section4">
<h1 class="text-center">
<strong> Social Media: </strong>
</h1>
<!-- Style buttons with images, find out how to -->
<a href="https://www.google.ca" target="_blank">
<button style="padding: 24px 24px 24px 24px;" class="btn round" type=""> </button>
<button> <input type="image" height="100px" width="100px" src="https://cdn.pixabay.com/photo/2016/04/28/23/55/snapchat-1360003_960_720.jpg" class=" round" name=""> <
<button style="padding: 24px 24px 24px 24px; background: url('https://cdn.pixabay.com/photo/2016/04/28/23/55/snapchat-1360003_960_720.jpg');" class="round centre btn img-responsive" type="">
</button >
<button style="padding: 24px 24px 24px 24px;" class="btn round " type="">
</button>
<button style="padding: 24px 24px 24px 24px;" class="btn round " type="">
</button>
</a>
</div>
''':bulb: to format code use backticks! ``` more info
How do you go backbup a line in node repl to correct a mistak
If i wanna put a picture and put a paragraph of text in line as the pic, so like they are grouped together. how would i do that with html and css?
like this but with the picture on the right and lext on the left, then the next one opposite and so on...
guys i am having the hardest time creating a drop down menu
here is the link to my codepen
<li class="dropdown">
<a class="dropdown-toggle" data-toggle="dropdown" href="#">Page 1
<span class="caret"></span></a>
<ul class="dropdown-menu">
<li><a href="#">Page 1-1</a></li>
<li><a href="#">Page 1-2</a></li>
<li><a href="#">Page 1-3</a></li>
</ul>
</li>
oops wrong thing to paste here is the link to my codepen
I am trying to get page1 to work
try having a look here https://www.w3schools.com/css/css_dropdowns.asp
@zootechdrum
@MuhammedKarim I will try that thanks
zootechdrum sends brownie points to @muhammedkarim :sparkles: :thumbsup: :sparkles:
:cookie: 116 | @muhammedkarim |http://www.freecodecamp.org/muhammedkarim
You're welcome
@zootechdrum
Hi all
Salaam :)
i just wanna ask how many lesson are there on HTML and CSS
W salam
on where? on FCC?
what if i wanna jump to JS
@MuhammedKarim Yea mate
i think you can, but best to learn HTML and CSS first, it says 5 hours but i did it in like 30-40 mins
its not long at all
hmmm
just go for it bro, best to do it in order
ok no problem
let c u soon
c ya bro @MARahman49
your level is 116 i think
what are you learning mate
not level, just brownie points
im on the portfolio project atm @MARahman49
hmmm thats are points?
yup
if u complete each level on the map you get a point...i think
if i thank you like this u get a point @MARahman49
muhammedkarim sends brownie points to @marahman49 :sparkles: :thumbsup: :sparkles:
:cookie: 28 | @marahman49 |http://www.freecodecamp.org/marahman49
hmmm great
(y)
so u have 28 points in total... not bad bro
where are you from
i think i will have over 200 till morning
good luck bro :) @MuhammedKarim
England
- i meant to tag u, not myself lool
:D
great
whats your experience in programming
not any lool @MARahman49
but i can still try and help you in html, css and js
seriously that would be great
Sure :) @MARahman49 but im no expert tho, just to let u know
Hmmm no problem mat
we will help each other
hello everyone, I hope you all doing great…please need some help with a new project… I’m trying to achive full with hero image the link is https://ingundela.github.io/foremost/ but I’m still able to scross when I’ve not add any thing else… Thank in advance
add dropdowns
slidshows
@ingundela
@MARahman49 deal :P
@MARahman49 don’t understand… what I want o to have th image moving up a bit so that I can achive the full page height
you dont wanna see that overflow image right?
@ingundela you want to have that full image like no movement
@ingundela
style="height:100%"
try that bro
Hi, I want to ask a question about a challenge in Exact Change
if I have
checkCashRegister(19.50, 20.00,
[
["PENNY", 1.01],
["NICKEL", 2.05],
["DIME", 3.10],
["QUARTER", 4.25],
["ONE", 90.00],
["FIVE", 55.00],
["TEN", 20.00],
["TWENTY", 60.00],
["ONE HUNDRED", 100.00]
]);about the ["FIVE", 55.00] does it means I have 55/5 = 11 Five dollars cash?
@MARahman49 this is a 1900x 800 image with that image on the right… just want it to be full height … the way it is now you are able to scroll and it is not suppose to do that
@MuhammedKarim when I change height: 100vh, to 100% the all image is gone
@zd-zero It means 55 dollars in fives.
or should I add
PENNY value + NICKEL value + DIME value ....
to get the total cash drawer
PENNY value + NICKEL value + DIME value ....
to get the total cash drawer
@ingundela the scrolling depends on the browser size...right?
@MuhammedKarim you should use
style="height: 100vh"
@ingundela add that image to body background or either have a css property with x-overflow:hidden;
for 100 % viewport height (vh)
for any height of browser,
for any height of browser,
he added image after his navbars i think thats why he face issue
ohh ok, thanks for letting me know :) @zd-zero
muhammedkarim sends brownie points to @zd-zero :sparkles: :thumbsup: :sparkles:
:cookie: 290 | @zd-zero |http://www.freecodecamp.org/zd-zero
@zd-zero that was a js challange?
@zd-zero That is the contents of the drawer in coins and notes. If you have for example a five dollar note, you cannot give 2 dollars back etc.
@MuhammedKarim yes, if you check my portfolio website http://ingundela.com/ this is what I want to achive… when open you get full height image...
ye, i get it now, because I got confused, thank you guys
@MuhammedKarim I could use the exact the same code but it is not working becouse in this new project I’ve added uppder-bar
nice website bro, i like it @ingundela
I'm sorry idk what uppder-bar is
@ingundela add that image to body background
Are you using bootstrap?
@ingundela thats a wordpress portfolio?
@MARahman49 what coding have u done so far?
@MuhammedKarim it’s not wordpress
@MuhammedKarim JS Java Andriod PHP
@MARahman49 done it but the upper-bar and navbar moved down
how can i make that text appear next to the image? in line with it...?
cool @MARahman49
@ingundela i didnt ask if its wordpress lol he asked
add text-align:right property to image i think
highly doubt that would work bro @MARahman49
try
didn't work bro
@MARahman49 You would make the image display inline-block with a set width of like 20% and then give the text a set width of like 80% width display inline block
@Masd925 could you advise me on this please?
oh ok @LeeConnelly12 lemme try it, thanks
muhammedkarim sends brownie points to @leeconnelly12 :sparkles: :thumbsup: :sparkles:
:cookie: 189 | @leeconnelly12 |http://www.freecodecamp.org/leeconnelly12
@MuhammedKarim I mean it depends on how the code is setup, have you got a link to the site or codepen we could see?
hmmm
css sucks
need practice on daily basis
@MuhammedKarim Using float is one way.
@Masd925 @LeeConnelly12 both of yours combined made it work :)
just one issue, how do i make it look normal?
Any sugestion guys?
sorry bro, im a noob :( @ingundela
@MuhammedKarim You can do what @Masd925 suggested. Remove float right from the text and just float the image to the left
@ingundela pen it
@MARahman49 added background image in body and I could get the full height image but all the content move down
check it now, it still doesn't work the normal way... @LeeConnelly12
@MARahman49 like to the center of the page...
how to fix that
@ingundela
margin:0?
@MuhammedKarim You want to center it?
@MuhammedKarim Wrap the image and text in a div and then set the div to display block margin auto
@MuhammedKarim stillno luck mate
oh wait....i think i just got it, i just needed space between the image and text @LeeConnelly12
@MuhammedKarim For a space between the image and text you could add margin-right to the image
@MuhammedKarim Or margin-left to text
@LeeConnelly12 thats pen is editable kindly help him mate
hero{
background: url('../img/foremost-hero.jpg');
background-repeat: no-repeat;
background-position: center center;
-webkit-background-size: cover;
background-size: cover;
position: relative;
top: 0;
bottom: 0;
height: 100vh;
z-index: 1;
i got it bro, check it now :) @LeeConnelly12
@MARahman49 he's helping just fine bro!
@MuhammedKarim maybe if we could make the image to move up till we get the full image height
@ingundela can you put it in codepen please?
@MuhammedKarim doing it
ok
@MuhammedKarim https://codepen.io/ingundela/pen/xYVZrK
@MuhammedKarim I’m not able to get the image in there
copy ur image and paste it here
then use the link generated for the codepen
and it should work
@MuhammedKarim I’m not wining mate
@ingundela You have to host that image somewhere, so upload it to imgur and use the imgur link. You can't use local files on codepen