How to use Div Tags and CSS to Create Responsive Website Layouts and Custom CSS Menus

แชร์
ฝัง
  • เผยแพร่เมื่อ 4 พ.ย. 2024

ความคิดเห็น • 115

  • @williammckeever4790
    @williammckeever4790 2 ปีที่แล้ว

    I know this video is very old but I found it very helpful. All the more current videos seem to just skip over this basic information. I found it very helpful in setting up my css file on my current project. Thank you.

  • @nationaltradesman1781
    @nationaltradesman1781 6 ปีที่แล้ว

    Dude... I was looking to understand the CSS behind styling a button. I feel like I have just received a Class A education on how CSS actually works let alone what the heck it is. (which I didnt even really know) What an excellent presentation! I understand so much more than I did 45 minutes ago! THANK YOU SO MUCH!

  • @Candy-dc4zw
    @Candy-dc4zw 7 ปีที่แล้ว

    I am a website design newbie, and I was completely overwhelmed by all the study materials we are covering in my class. This video was organized and informative, extremely easy to follow and helped clear up the fog for me. Also I love your accent!

  • @CodingCue
    @CodingCue 5 ปีที่แล้ว

    Great boss. Thank you so much...this is first time I clearly understood how to use div after taking university classes for 3 months

  • @mikeyryan9581
    @mikeyryan9581 9 ปีที่แล้ว

    I have been looking up css tutorials all day. by far the best. Thanks!

  • @francoluz2629
    @francoluz2629 6 ปีที่แล้ว

    Thank you! Step by step...you help me understand this better than reading my book...

  • @KhanReyad
    @KhanReyad 7 ปีที่แล้ว

    I'm from Bangladesh. This is Reyad Khan.Your explanation is very nice..! Keep going..!

  • @fsk8taboy79
    @fsk8taboy79 7 ปีที่แล้ว

    I cannot thank you enough for this video!!! I'm new to coding and was getting lost to get to the next step in my learning. You're freaking awesome!! Again thank you!

  • @lahdi_thai23
    @lahdi_thai23 8 ปีที่แล้ว +3

    I'm so happy that I was able to follow along and understand this tutorial. You're awesome!

  • @jupitermc6188
    @jupitermc6188 9 ปีที่แล้ว +1

    Your tutorial and is one of the best available, no question.... plus say bottom like you do. Bottoms-up!

  • @peterdixon6083
    @peterdixon6083 9 ปีที่แล้ว +12

    Great information. I was stuck on clear for days.

  • @ymysak
    @ymysak 7 ปีที่แล้ว

    awesome man! i've been struggling with visualizing the layout - you're the first one to explain it in the way i understood! Dope!

  • @nokutos
    @nokutos 9 ปีที่แล้ว

    It worked!!! I am so grateful to have found this tutorial, thank you so much!!!!!!!

  • @ronnybanerjee6020
    @ronnybanerjee6020 7 ปีที่แล้ว

    It is a very good video based on CSS. 100% talent shown. Thank you sir!!

  • @sreerajcsreerajc
    @sreerajcsreerajc 8 ปีที่แล้ว +1

    Really nice video. I don't understand why people dislike this video?

  • @Abinash4Adidas
    @Abinash4Adidas 7 ปีที่แล้ว

    Thanks man. You have been a great mentor for this idiot. I was stuck with the float thing for weeks. And it was cleared by you. Appreciate the good work. :)

  • @smusic6269
    @smusic6269 6 ปีที่แล้ว

    very usefull information..and the way u teaching is very nice and clear.....easy to undesrtood..i tryed the lesson..success

  • @HECTORJABUNDISJR
    @HECTORJABUNDISJR 9 ปีที่แล้ว

    this is great.. just what I needed to see ... This is somewhat the idea I have pictured on my head, but I couldn't figureout how to do it.. thank you

  • @judithehde4505
    @judithehde4505 5 ปีที่แล้ว

    Finally! Something I can understand. Thank you so much!

  • @VinodKashyap-jb4ny
    @VinodKashyap-jb4ny 3 ปีที่แล้ว +1

    That's what I was looking for. Thank You Very Much Sir.

  • @rpvikadan
    @rpvikadan 8 ปีที่แล้ว

    Thanks for the great tutorial, I learned so much in less than 35 minutes. The session was very useful and understanding. I will be following SimpleTut from now. . . Thums Up to the team

  • @alexanderrunemark6675
    @alexanderrunemark6675 7 ปีที่แล้ว +3

    One question. Why do you use id instead of class in your div? Is there any big difference between them? And yea im new into the programming world :)

  • @WolfyLix
    @WolfyLix 9 ปีที่แล้ว +5

    right at the part where i "should" fix the div tags with the float, the menu div disappear! I tripled checked the code, its 100% identical to the one in the video, but the menu div disappear. Ideias, Solutions? Anyone?

  • @solusfoundation
    @solusfoundation 9 ปีที่แล้ว +2

    Hi. I'm really enjoying your tutorial and got as far as the menu css very easily, thank you. However, when following your instructions and code to the letter, my menu doesn't appear the same as yours. It's still a bulleted list. I'm using DW CS6. Any advice would be greatly appreciated. Thanks again.

  • @SwapnilShindebk
    @SwapnilShindebk 6 ปีที่แล้ว

    Awesome tutorial. Simple to understand content allignment using CSS.

  • @n.saravanannsaravanan8545
    @n.saravanannsaravanan8545 7 ปีที่แล้ว

    Thanks a lot, A step by step explanation to design a layout using div, expecting more tutorials from you :)

  • @haroldmcbroom7807
    @haroldmcbroom7807 6 ปีที่แล้ว

    I learned a lot, thanks... I was wondering, instead of changing the background color when you hover over a menu item, is there a way to just change the text color, for example, if the menu item by default is a dark red, when hovering over, would become a lightred?

  • @ahmaadadesola4136
    @ahmaadadesola4136 9 ปีที่แล้ว

    I definitely appreciate the video. It was an enormous amount of help.

  • @dharmabudha3395
    @dharmabudha3395 9 ปีที่แล้ว

    Thank you I have learned more in this one video then I have in college for Web Desig

  • @malendorn1558
    @malendorn1558 8 ปีที่แล้ว

    hello teacher how are you today? i come from Cambodia. when i watch your video i think that is very good.

  • @harrazmasri2805
    @harrazmasri2805 6 ปีที่แล้ว

    thanks bro,you're like a teacher

  • @JEEPMASKOAFRICA
    @JEEPMASKOAFRICA 6 ปีที่แล้ว

    you have made it i love this wau great i did it with bracket editor, you are my teacher, RESPECT

  • @one4mrDj
    @one4mrDj 9 ปีที่แล้ว

    Great video, thanks. I just have one quesion. When you create the master div ( or container div) why don't you end that tag like you end all the other tags? Or is it not necessarily? Or I just did not see it.

  • @ectr93
    @ectr93 9 ปีที่แล้ว +31

    What would I do without TH-cam? Probaly failed in exam haha. Thank you so much :)

  • @deNNyTheWiseMAN1
    @deNNyTheWiseMAN1 5 ปีที่แล้ว

    Exactly why I was looking for!

  • @arvindbilwal3374
    @arvindbilwal3374 6 ปีที่แล้ว

    First time i learn it. Good...

  • @mathew2201
    @mathew2201 6 ปีที่แล้ว

    One quick question: Why did you use "background-color:#..." under each ID, except the footer where you only used "background:#..." to select the colour (UK spelling ;-) )? Any answer would be really appreciated. Thanks.

  • @indigoforlife
    @indigoforlife 8 ปีที่แล้ว +1

    Amazing tutorials. Thank you!

  • @AbedElkassih
    @AbedElkassih 9 ปีที่แล้ว

    Wonderfull job, even though I am not using DV, I still like your through explantion of CSS

  • @ailapintor7851
    @ailapintor7851 9 ปีที่แล้ว +7

    what is the name of the application that you use to make this??

  • @richarddemeny611
    @richarddemeny611 8 ปีที่แล้ว

    very helpful and easy to understand. respect

  • @emanal-shehri1701
    @emanal-shehri1701 4 ปีที่แล้ว

    God bless you!! What a video!

  • @JosephMedinaDirector
    @JosephMedinaDirector 7 ปีที่แล้ว

    Excellent work😇. Thanks for posting it!

  • @NanaSupriatnaIFaKa
    @NanaSupriatnaIFaKa 8 ปีที่แล้ว

    Thank's, Amazing Tut, you help Me verry much

  • @dmitxd
    @dmitxd 9 ปีที่แล้ว

    Great Job,I learn Much,thanks

  • @nrane1
    @nrane1 9 ปีที่แล้ว +2

    Thank you.......very simply explanation.

  • @waqarshafiq
    @waqarshafiq 9 ปีที่แล้ว +1

    Thanks for your tutorials.

  • @huzaifaalam513
    @huzaifaalam513 6 ปีที่แล้ว

    really loved your video

  • @aslyrics903
    @aslyrics903 6 ปีที่แล้ว

    Sir Can you please tell me the name of editor you used in this video? sir tell me as early as possible.

  • @ClaudiuFilmat
    @ClaudiuFilmat 8 ปีที่แล้ว

    You're a miracle! Thanks a lot.

  • @gohhb6110
    @gohhb6110 7 ปีที่แล้ว

    Clear cut! Thank you!

  • @tien171074
    @tien171074 9 ปีที่แล้ว

    awesome....you make it simple...great

  • @Solarplex100
    @Solarplex100 10 ปีที่แล้ว

    Keep up the good tutorials!

  • @jerryfreshprince1423
    @jerryfreshprince1423 9 ปีที่แล้ว

    What shortcut do you use for linking the Css file in the href="..."

  • @ViperOne420
    @ViperOne420 9 ปีที่แล้ว +1

    This is great. Thank you

  • @dhiyow9775
    @dhiyow9775 7 ปีที่แล้ว

    what code editor did he/you use, 'cause that looks awesome, i've spent my time only using atom and that will safe my time dramatically...
    pls respond...

    • @nnhhaadd
      @nnhhaadd 7 ปีที่แล้ว

      adobe dreamweaver cc

    • @smaklilu90
      @smaklilu90 7 ปีที่แล้ว

      adobe dreamweaver

    • @MrKhaledBWZ
      @MrKhaledBWZ 7 ปีที่แล้ว

      dreamweaver

    • @tijon1350
      @tijon1350 6 ปีที่แล้ว

      Dreamweaver

  • @methodjohn2507
    @methodjohn2507 7 ปีที่แล้ว +1

    helpful than ever, thanks

  • @qaziikram8106
    @qaziikram8106 8 ปีที่แล้ว

    i like the method of your teaching :-)

  • @amrfoda7619
    @amrfoda7619 9 ปีที่แล้ว

    ohhhhhhhhhhhh thank you a lot , I was almost crazy for that responsive webpage thank you mr . simple tut

  • @knzamy
    @knzamy 7 ปีที่แล้ว +3

    thank you..very easy to understand...

  • @binyamgetnet4025
    @binyamgetnet4025 9 ปีที่แล้ว

    i like the tutorials continu 10q for all

  • @rush2004
    @rush2004 6 ปีที่แล้ว

    Thanks got it working now.

  • @samy7B9
    @samy7B9 9 ปีที่แล้ว

    Great video. very simple illustration... Thanks...

  • @ohad7
    @ohad7 7 ปีที่แล้ว

    great tutorials thank you guys for the help.

  • @DawnOfTheDead991
    @DawnOfTheDead991 9 ปีที่แล้ว +3

    why not just body{ margin:auto;} as the default?

  • @oyinlolamicheal8439
    @oyinlolamicheal8439 6 ปีที่แล้ว

    Wow it was a good. Thank you very much

  • @lakshmipathiraju3283
    @lakshmipathiraju3283 8 ปีที่แล้ว +1

    Amazing video tutorials. i like so much :)

  • @mohnoorie9324
    @mohnoorie9324 7 ปีที่แล้ว

    AMAZING TOUCH!!!!!!!!!!!!!!!!!!

  • @Rajesh-vc3dw
    @Rajesh-vc3dw 7 ปีที่แล้ว

    Simple and great.

  • @Pokemonman44441
    @Pokemonman44441 7 ปีที่แล้ว

    Im excited for this.

  • @neelchaudhary7607
    @neelchaudhary7607 8 ปีที่แล้ว

    amazing tutorial !! Thank you bro

  • @ZikoHendrix
    @ZikoHendrix 8 ปีที่แล้ว

    This is a good idea !

  • @patilbhushan
    @patilbhushan 9 ปีที่แล้ว

    Thanks it really helped a lot....

  • @derekdiaz5688
    @derekdiaz5688 5 ปีที่แล้ว

    Clear both is not working for me. Any tips to get the footer to show?

  • @Skillz0r
    @Skillz0r 6 ปีที่แล้ว

    Somehow when I name the file layout.php it doesnt do anything (using chrome) but when using it layout.html it works fine. Anyone knows what's up with that?

  • @wesselvdvelde
    @wesselvdvelde 6 ปีที่แล้ว

    Nice video!

  • @alexandrugrecov8964
    @alexandrugrecov8964 9 ปีที่แล้ว

    great and easy to understand

  • @kaleidoscopic_bani
    @kaleidoscopic_bani 7 ปีที่แล้ว

    excellent. really loved ur vdo.

  • @BP-vi1nl
    @BP-vi1nl 7 ปีที่แล้ว

    but when i put the code for responsive page it give error, i am using dreamweaver CC14

  • @dfoxx7109
    @dfoxx7109 8 ปีที่แล้ว

    Very informative video...

  • @proo5577
    @proo5577 7 ปีที่แล้ว

    good looking out bro

  • @nctrn07
    @nctrn07 9 ปีที่แล้ว +1

    really nice tutorial! but when i resize my chrome, it doesnt change.. it does change only in explorer

    • @swtnlnly
      @swtnlnly 9 ปีที่แล้ว

      David Pocar So much as even a single character missing or out of place in the html or the css file (or both) will cause errors. Eventually I got it done and it worked but the top banner I threw into the header with a. IMG SRC tag would not scale Fixed did with a -------> #img {max-width: 100%;}

  • @rajvaibhavsingh5539
    @rajvaibhavsingh5539 9 ปีที่แล้ว

    great work!!!!!!!!!!!!!!!!!!!

  • @rommyarb
    @rommyarb 9 ปีที่แล้ว

    great tutorial!

  • @dougui20
    @dougui20 4 ปีที่แล้ว

    great content

  • @AldrichQuaiHoi
    @AldrichQuaiHoi 8 ปีที่แล้ว

    Excellent !

  • @kalengavision5777
    @kalengavision5777 6 ปีที่แล้ว

    Good tutoriel

  • @sujanmalla9925
    @sujanmalla9925 9 ปีที่แล้ว +1

    Great video

  • @sudhi4urs
    @sudhi4urs 9 ปีที่แล้ว

    Nice one!!!

  • @gioiarajuli8541
    @gioiarajuli8541 4 ปีที่แล้ว

    thank you very much!

  • @Kuwandi
    @Kuwandi 7 ปีที่แล้ว

    Very very good thanks***!!!

  • @adnebekkestad8433
    @adnebekkestad8433 9 ปีที่แล้ว

    to add extra style to the menu bar you can aslo add the tag "#menu li:active {
    background-color:#example;
    }

  • @asimplelifevlog6684
    @asimplelifevlog6684 8 ปีที่แล้ว

    very helful tutorials

  • @EDDIEGARAGE
    @EDDIEGARAGE 7 ปีที่แล้ว

    basically great, thank you

  • @powertm3201
    @powertm3201 9 ปีที่แล้ว

    Thank you so much !

  • @chutkiandsaharsh3435
    @chutkiandsaharsh3435 9 ปีที่แล้ว +1

    very useful to me

  • @srinathchandra7238
    @srinathchandra7238 8 ปีที่แล้ว

    awesome bro

  • @sungod8781
    @sungod8781 8 ปีที่แล้ว

    thanks for video

  • @eastern815
    @eastern815 7 ปีที่แล้ว

    thanks man

  • @usman-ishaq8838
    @usman-ishaq8838 9 ปีที่แล้ว

    Thanks very nice