Forums

The forums ran from 2008-2020 and are now closed and viewable here as an archive.

Home Forums CSS New to CSS. Anyone want to see mt first attempt :)

  • This topic is empty.
Viewing 11 posts - 1 through 11 (of 11 total)
  • Author
    Posts
  • #33267
    GeneralKnowledge
    Participant

    I just started learning CSS last night so forgive my terrible design.

    http://beta.squrk.com

    I am more of a php programmer. I would appreciate any feedback it is obvious in the early stages.

    Also quick question does anyone know why having doctype “” stops “background-size: 100% 100%;” from running?

    Is it because background-size: is CSS3.

    I am also interested on the background image. Does it show which city you are in correctly. How close it is?

    Thanks for your time.

    GeneralKnowledge

    #82370
    Waffle
    Member

    I must say, your CSS isn’t bad if you say it’s your first go.
    Personally, for something so simple, I would have done 1 main Div id.. and then div classes for the items inside the main div id.

    For example;





    Squrk!!




    ETC ETC.


    This way, it’s much easier to style, a litle bit less code… and rather than giving each element the positioning.. its done in 1 hit.

    #82341
    jamygolden
    Member

    I think you should use ID’s wherever possible instead of classes, however, IDs should only be used once per page. As far as I know, javascript and CSS render IDs faster than classes. Also, try and keep you CSS selectors as precise as possible, eg: ‘a’ or ‘#menu a{}’, instead of ‘html body #content ul#menu li a{}’

    I would do it like this:
    CSS

    HTML

    Regarding the background-size and doctype, I’m not sure. Try using this doctype instead:

    As for the map. It’s way off :p I’m in South Africa and it was showing a map of Los Altos.

    #82437
    GeneralKnowledge
    Participant

    I tried “” no luck which is strange because I looked it up and it said that was html5’s doctype Oh well, I’ll try do something else other than “background-size:”. I think you are correct about javascript and CSS rendering ID’s faster, jamy_za your CSS is beautiful done, Thanks for your help. I can see how that is better.

    I fixed the geolocation me being stupid I had hard coded it where the google servers are(Don’t ask), should work a treat now.

    Thanks for all your help.

    #82439
    jamygolden
    Member

    @GeneralKnowledge No problem, and good luck with your project. It seems pretty awesome so far =)

    Check this out: https://css-tricks.com/3458-perfect-full-page-background-image/
    It may help you with the full width background images.

    #82440
    KMarimon1
    Participant

    I’m not getting a background image at all, I’m in Miami

    #82442
    jamygolden
    Member

    @KMarimon1 maybe it’s still loading. Try hitting cmd / ctrl + R
    It seems to be working correctly for me.

    #82443
    KMarimon1
    Participant

    @jamy_za I’m sure its done loading, all i’m getting is a plain white background here is a screenshot (See for yourself)

    #82454
    GeneralKnowledge
    Participant

    @jamy_za https://css-tricks.com/3458-perfect-full-page-background-image/ worked perfectly. Very nice.


    @KMarimon1
    I have fixed the problem I think. I am currently exception checking. I use javascript and cookies, I am current making a fall back. So it will work in a way with either. I am going to try and get it working with more browsers.

    #82493
    furrball1383
    Member

    hmm didn’t work with enough precision, it put me in hyderabad india and i’m in mumbai which is maharashtra india, other than that its pretty simple but sweet :D

    #82527
    GeneralKnowledge
    Participant

    @sL1dr Yes it’s a total bummer. Before I had javascript calculate your windows aspect ratio and then translate that to the correct ratio for Google’s API and then scaling the image. @furrball1383 Just getting it in 640×640 and scaling is a lot simpler but less precise. 500-600km away I think, it’s getting closer sometime it is just terrible at locating someone. You may be behind some kind of proxy which always makes it hard to find some ones true location.

    Fixed the problem’s with the background not showing up at all and I am got out the need for cookies. Now cookie is used to slightly reduce server load. Precision will always be a problem :(

    Thanks for viewing.

Viewing 11 posts - 1 through 11 (of 11 total)
  • The forum ‘CSS’ is closed to new topics and replies.