Author Topic: Please don't hunt me down and kill me  (Read 1031 times)

0 Members and 1 Guest are viewing this topic.

Offline mugman

  • /dev/null
  • *
  • Posts: 5
  • Cookies: -1
  • 4. Freedom is good
    • View Profile
Please don't hunt me down and kill me
« on: June 06, 2015, 01:56:21 am »
Ok, I would like to set a record for the dumbest question ever asked by a novice on EZ.
I’m trying to learn HTML / CSS on Code Academy. All is going well, except I cannot get my text to align over my image:
<!DOCTYPE html>
<html>
                <head>
                                <link type="text/css" rel="stylesheet" href="stylesheet.css"/>
                                <title>My Social Network</title>
                </head>
                <body>
                               
                                <div class="contain"><a href="http://www.google.com"><img src="http://nl.androlib.com/appscreenmax/ppDww.u.cs.png"; id="me"></a><p id="one"; text-align="center">Help</p></div>
                               
                               
                </body>
</html>
 
CSS below!
 
.contain {
    border-color: purple;
    border-width: 100px;
    position: absolute;
}
 
#me {
    width:100px;
    height:100px;
    border-radius:100%;
    position: absolute;
}
 
#one {
    position: relative;
    font-size: 20px;
    text-align: center;
}
 
I have genuinely been searching for a solution to this for about two hours on google, please help and feel free to take the piss.
Also, my border is not showing up as purple.
Kindest Regards
Mugman

Offline Rytiou

  • Noob Zombie
  • VIP
  • Knight
  • *
  • Posts: 199
  • Cookies: 45
  • EZ's Noob
    • View Profile
Re: Please don't hunt me down and kill me
« Reply #1 on: June 06, 2015, 02:44:57 am »
Alright I see a couple of things wrong here.

1. For starters, Since I don't see your external style sheet you need to have your CSS in <style> tags if you're just doing this part outside your external style sheet (unless you already have a css file elsewhere which in case you'd ignore this).

2. To get your image border working don't put it in your .contain Instead, create an image selector and use: border:(size in px)px soild (in your case I'm assuming) colorname;

3. Finally, to reposition your text where you want it you're going to want to use some CSS positioning propreties inside of your #one id (left, right, bottom, top etc)

This should help you fix the issue you were having. Also, for future reference please put code you're having trouble w/ in code tags on the fourm. Good luck on the project you're working on.
« Last Edit: June 06, 2015, 02:46:47 am by Rytiou »
Quote from: Evilzone IRC
<EZBot> life, you're so lame we decided to change your nick to Rytiou's bitch.
<EZBot> Rytiou is lord of the fags and will suck dicks for shells.

Offline mugman

  • /dev/null
  • *
  • Posts: 5
  • Cookies: -1
  • 4. Freedom is good
    • View Profile
Re: Please don't hunt me down and kill me
« Reply #2 on: June 06, 2015, 05:12:52 am »
That has sorted it, thank you Rytiou..

Can I ask though please, with regards to your response (point number three); is there not an easier way to align the text exactly to the middle of the image, without having to manually adjust the margins? i.e left: 50px; top 50px etc.. Not only is this time consuming and code heavy, it is not entirely accurate?

Mugman

Offline techb

  • Soy Sauce Feeler
  • Global Moderator
  • King
  • *
  • Posts: 2350
  • Cookies: 345
  • Aliens do in fact wear hats.
    • View Profile
    • github
Re: Please don't hunt me down and kill me
« Reply #3 on: June 06, 2015, 06:32:00 am »
That has sorted it, thank you Rytiou..

Can I ask though please, with regards to your response (point number three); is there not an easier way to align the text exactly to the middle of the image, without having to manually adjust the margins? i.e left: 50px; top 50px etc.. Not only is this time consuming and code heavy, it is not entirely accurate?

Mugman

Uhhh.. center. Please post this kind of thing on sites that accept it like Stackoverflow or Daniweb. Rytiou was kind on giving you an answer, but this is NOT the site to post such questions. If it is about hackin then sure maybe, but this is simple homework help kinda shit and is not welcome here. There are plenty of sites like daniweb and stackoverflow to help with such things.

Locked because it should just not be in this forum, also locked and not removed since an answer  is given and maybe someone else might see this before posting such questions.

/
>>>import this
-----------------------------