- Joined
- Apr 29, 2016
- Messages
- 3,475
- Reaction score
- 6,963
- Points
- 763
- Age
- 44
- Gender
- Male
Lets see your codeGood morning.
@rsmath Sorry I didn't get back to you yesterday. No, it was Greg Sidelnikov and the book is CSS Visual Dictionary.
my kind of morning
All about the morning wood huh?my kind of morning
I knew I shouldn't click on that, but did it anyway. Like looking at a train wreck--you can't help yourself.
LOL NO!@Mecca I keep getting stuff related to protein shakes, which I was looking into last night. Were you looking into wiener stuff?
The truth always comes to the surface. Like throwing a body in a bog. Up it pops when you least expect it....Google's better than the NSA for knowing your business.@Mecca I keep getting stuff related to protein shakes, which I was looking into last night. Were you looking into wiener stuff?
I haven't but it's sitting in my queue. I too am interested in it.Anyone done the work for Francesa Gino yet? I don't think the book chapters take long to read, but wondering about the survey.
except when it gets it wrong. like telling me how long my drive to work is every morning just cause i went to the grocery store once.The truth always comes to the surface. Like throwing a body in a bog. Up it pops when you least expect it....Google's better than the NSA for knowing your business.
That is hilarious.except when it gets it wrong. like telling me how long my drive to work is every morning just cause i went to the grocery store once.
Ah, but now they know what store you went to and probably what you bought and how you paid for it....maybe what color your socks were, too.except when it gets it wrong. like telling me how long my drive to work is every morning just cause i went to the grocery store once.
Ok.Lets see your code
<!DOCTTYPE html>
<html>
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<style>
html {
box-sizing: border-box;
background-color:darkgray;
}
*, *:before, *:after {
box-sizing: inherit;
}
.eye {
position: relative;
background-color: pink;
height: 80px;
width: 180px;
left: 562px;
top: 200px;
border-radius: 50%;
box-shadow: 0px 20px 10px inset;
}
.eye-hole {
position: absolute;
top: -72px;
left: -40px;
height: 150px;
width: 150px;
background-color: transparent;
border-radius: 71px;
transform: rotate(27deg) skew(152deg);
-webkit-transform: rotate(27deg) skew(152deg);
border-top: 35px solid ;
border-left: 25px solid ;
border-right: 14px solid ;
border-bottom: 1px solid ;
border-color: hsl(30, 100%, 75%);
}
.eye-ball {
position: absolute;
left: 600px;
top: 200px;
height: 95px;
width: 105px;
background-color: #f8ffed;
border-radius: 150px;
box-shadow: 0px 0px 20px inset;
}
.iris-pupil {
position: absolute;
top: 15px;
left: 15px;
height: 70px;
width: 70px;
background-color: black;
border-radius: 100%;
border: 19px solid blue;
}
.eye-lid {
position: absolute;
top: -62px;
left: -30px; /*Move this and left on eye-lashes the same to move position of the eye-ball*/
height: 126px;
width: 130px;
margin: 10px 0px;
background-color: transparent;
border-radius: 71px;
transform: rotate(22deg) skew(145deg);
-webkit-transform: rotate(22deg) skew(145deg);
border-top: 35px solid;
border-left: 25px solid;
border-right: 15px solid;
border-bottom: 8px solid;
border-color: hsl(30, 100%, 70%);
border-bottom-left-radius: 50px 60px;
}
.eye-lashes {
position: absolute;
top: -45px;
left: -40px;
height: 83px;
width: 110px;
margin: 20px;
background-color: transparent;
border-radius: 86px;
transform: rotate(10deg) skew(140deg);
-webkit-transform: rotate(10deg) skew(140deg);
border-top: 17px solid;
border-left: 4px solid;
border-right: 15px solid;
border-bottom: 3px solid;
border-color: black;
box-shadow: 0px 0px 10px inset, 0px 0px 80px;
border-bottom-left-radius: 30px 40px;
}
</style>
</head>
<body>
<div class="eye">
</div>
<div class="eye-ball">
<div class="iris-pupil">
<div class="eye-hole">
</div>
<div class="eye-lid">
</div>
<div class="eye-lashes">
</div>
</div>
</div>
</body>
</html>
Which translates toOk.
Which is here. https://codepen.io/Jerami/pen/MxXJBQHTML:<!DOCTTYPE html> <html> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1"> <style> html { box-sizing: border-box; background-color:darkgray; } *, *:before, *:after { box-sizing: inherit; } .eye { position: relative; background-color: pink; height: 80px; width: 180px; left: 562px; top: 200px; border-radius: 50%; box-shadow: 0px 20px 10px inset; } .eye-hole { position: absolute; top: -72px; left: -40px; height: 150px; width: 150px; background-color: transparent; border-radius: 71px; transform: rotate(27deg) skew(152deg); -webkit-transform: rotate(27deg) skew(152deg); border-top: 35px solid ; border-left: 25px solid ; border-right: 14px solid ; border-bottom: 1px solid ; border-color: hsl(30, 100%, 75%); } .eye-ball { position: absolute; left: 600px; top: 200px; height: 95px; width: 105px; background-color: #f8ffed; border-radius: 150px; box-shadow: 0px 0px 20px inset; } .iris-pupil { position: absolute; top: 15px; left: 15px; height: 70px; width: 70px; background-color: black; border-radius: 100%; border: 19px solid blue; } .eye-lid { position: absolute; top: -62px; left: -30px; /*Move this and left on eye-lashes the same to move position of the eye-ball*/ height: 126px; width: 130px; margin: 10px 0px; background-color: transparent; border-radius: 71px; transform: rotate(22deg) skew(145deg); -webkit-transform: rotate(22deg) skew(145deg); border-top: 35px solid; border-left: 25px solid; border-right: 15px solid; border-bottom: 8px solid; border-color: hsl(30, 100%, 70%); border-bottom-left-radius: 50px 60px; } .eye-lashes { position: absolute; top: -45px; left: -40px; height: 83px; width: 110px; margin: 20px; background-color: transparent; border-radius: 86px; transform: rotate(10deg) skew(140deg); -webkit-transform: rotate(10deg) skew(140deg); border-top: 17px solid; border-left: 4px solid; border-right: 15px solid; border-bottom: 3px solid; border-color: black; box-shadow: 0px 0px 10px inset, 0px 0px 80px; border-bottom-left-radius: 30px 40px; } </style> </head> <body> <div class="eye"> </div> <div class="eye-ball"> <div class="iris-pupil"> <div class="eye-hole"> </div> <div class="eye-lid"> </div> <div class="eye-lashes"> </div> </div> </div> </body> </html>
actually, it thinks it knows what store i went to. keeps asking me to do surveys for how i liked my experience for stores i didn't go near when i go to the shopping center.Ah, but now they know what store you went to and probably what you bought and how you paid for it....maybe what color your socks were, too.
Nice. You are going full on artist mode with that css:thumbup::thumbup::thumbup:so many zoltars...