- This topic is empty.
Viewing 4 posts - 1 through 4 (of 4 total)
Viewing 4 posts - 1 through 4 (of 4 total)
- The forum ‘CSS’ is closed to new topics and replies.
The forums ran from 2008-2020 and are now closed and viewable here as an archive.
hi,
trying to center an edge animation in a div tag so that when the page is resized for tablets or smart phones it centers in the div automatically. what i have so far is:
WHICH IS THE DIV TAG THAT HOLDS THE OBJECT
.center1 {
width: 100%;
float: left;
background-color: rgba(255,255,0,.0);
padding: 10px 0px 20px 0px;
-moz-border-radius: 10px;
-webkit-border-radius: 10px;
border-radius: 10px; /* future proofing */
-khtml-border-radius: 10px;
padding-left: 1%;
padding-right: 1%;
margin-right: 2%;
margin-bottom: 30px;
}
THIS IS THE DIV FOR THE EDGE ANIMATION ITSELF
#aboutAnimation{
position:relative;
width: 100%;
height: 330px;
}
right now it is floating left. i’ve tried just about everything. any help would be greatly appreciated. the page can be seen at
http://drotardesign.com/dd/about.html
it’s the second box down the page with a green background.
thanks
Box3? Your design is very busy and cluttered.
Have you tried something like this:
@media only screen and (max-width: 800px) {
.center1 {
width: 100%;
}
}
Looks centered to me…did you fix it?
Is there a specific width range at which it’s now working right?