Wrapping div around floating objects?
up vote
1
down vote
favorite
Just a forewarning, I am aware for the most part of how float works, and I understand that a div will not wrap floating objects. However, a came across a section of code on w3 schools and I'm a bit confused. Essentially, they use a ul and they float the li items, but the ul wraps to fit the height of the list items. If i were to do the same thing with a div, the div and the list items would not line up, I'm just curious as to why it works with the ul but not with div?
the code can be found here
https://www.w3schools.com/css/tryit.asp?filename=trycss_navbar_horizontal_black_right
html css
asked Nov 10 at 16:03
PVT_Mozart
83
add a comment |
up vote
1
down vote
favorite
Just a forewarning, I am aware for the most part of how float works, and I understand that a div will not wrap floating objects. However, a came across a section of code on w3 schools and I'm a bit confused. Essentially, they use a ul and they float the li items, but the ul wraps to fit the height of the list items. If i were to do the same thing with a div, the div and the list items would not line up, I'm just curious as to why it works with the ul but not with div?
the code can be found here
https://www.w3schools.com/css/tryit.asp?filename=trycss_navbar_horizontal_black_right
html css
asked Nov 10 at 16:03
PVT_Mozart
83
add a comment |
up vote
1
down vote
favorite
up vote
1
down vote
favorite
Just a forewarning, I am aware for the most part of how float works, and I understand that a div will not wrap floating objects. However, a came across a section of code on w3 schools and I'm a bit confused. Essentially, they use a ul and they float the li items, but the ul wraps to fit the height of the list items. If i were to do the same thing with a div, the div and the list items would not line up, I'm just curious as to why it works with the ul but not with div?
the code can be found here
https://www.w3schools.com/css/tryit.asp?filename=trycss_navbar_horizontal_black_right
html css
asked Nov 10 at 16:03
PVT_Mozart
83
Just a forewarning, I am aware for the most part of how float works, and I understand that a div will not wrap floating objects. However, a came across a section of code on w3 schools and I'm a bit confused. Essentially, they use a ul and they float the li items, but the ul wraps to fit the height of the list items. If i were to do the same thing with a div, the div and the list items would not line up, I'm just curious as to why it works with the ul but not with div?
the code can be found here
https://www.w3schools.com/css/tryit.asp?filename=trycss_navbar_horizontal_black_right
html css
html css
asked Nov 10 at 16:03
PVT_Mozart
83
asked Nov 10 at 16:03
PVT_Mozart
83
asked Nov 10 at 16:03
PVT_Mozart
83
asked Nov 10 at 16:03
PVT_Mozart
83
asked Nov 10 at 16:03
PVT_Mozart
83
83
add a comment |
add a comment |
1 Answer
1
active
oldest
votes
up vote
0
down vote
accepted
The CSS for the ul in that example contains overflow: hidden;. This makes an element wrap floating child elements. There's no difference in that respect whether it's a ul or div.
answered Nov 10 at 16:14
Johannes
36.1k92764
oh okay awesome, i appreciate it
– PVT_Mozart
Nov 10 at 16:19
add a comment |
1 Answer
1
active
oldest
votes
1 Answer
1
active
oldest
votes
active
oldest
votes
active
oldest
votes
up vote
0
down vote
accepted
The CSS for the ul in that example contains overflow: hidden;. This makes an element wrap floating child elements. There's no difference in that respect whether it's a ul or div.
answered Nov 10 at 16:14
Johannes
36.1k92764
oh okay awesome, i appreciate it
– PVT_Mozart
Nov 10 at 16:19
add a comment |
up vote
0
down vote
accepted
The CSS for the ul in that example contains overflow: hidden;. This makes an element wrap floating child elements. There's no difference in that respect whether it's a ul or div.
answered Nov 10 at 16:14
Johannes
36.1k92764
oh okay awesome, i appreciate it
– PVT_Mozart
Nov 10 at 16:19
add a comment |
up vote
0
down vote
accepted
up vote
0
down vote
accepted
The CSS for the ul in that example contains overflow: hidden;. This makes an element wrap floating child elements. There's no difference in that respect whether it's a ul or div.
answered Nov 10 at 16:14
Johannes
36.1k92764
The CSS for the ul in that example contains overflow: hidden;. This makes an element wrap floating child elements. There's no difference in that respect whether it's a ul or div.
answered Nov 10 at 16:14
Johannes
36.1k92764
answered Nov 10 at 16:14
Johannes
36.1k92764
answered Nov 10 at 16:14
Johannes
36.1k92764
answered Nov 10 at 16:14
Johannes
36.1k92764
36.1k92764
oh okay awesome, i appreciate it
– PVT_Mozart
Nov 10 at 16:19
add a comment |
oh okay awesome, i appreciate it
– PVT_Mozart
Nov 10 at 16:19
oh okay awesome, i appreciate it
– PVT_Mozart
Nov 10 at 16:19
oh okay awesome, i appreciate it
– PVT_Mozart
Nov 10 at 16:19
add a comment |
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
StackExchange.ready(
function () {
StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f53240768%2fwrapping-div-around-floating-objects%23new-answer', 'question_page');
}
);
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
